Підручник css - що таке css

Що таке CSS? CSS (Cascading Style Sheets - Каскадні таблиці стилів) - це просто певний набір правил, що вказують, яким чином відображати елементи сторінки, створеної за допомогою мови HTML. Раніше всі функції по включенню самого вмісту в сторінку і завданням його зовнішнього вигляду брав на себе HTML, але потім було вирішено розділити ці функції. Тепер HTML відповідає тільки за те, що саме буде присутній на сторінці (текст, зображення, таблиці, посилання і т.д.), а CSS вказує, який зовнішній вигляд буде у всіх цих елементів (форма, колір і т.д.) .

Крім цього, використовуючи CSS можна змінити не тільки зовнішній вигляд, але і положення будь-якого елементу незалежно від того, де він знаходиться в самому HTML-коді сторінки. Більш того, для мови CSS було придумано стільки варіантів і можливостей по зміні всіх цих параметрів, які і не снилися HTML.

Але і це ще не все. CSS дозволяє буквально в рази скоротити обсяг коду. Використовуючи його, ви можете просто забути про такі речі, як прописування параметрів кольору, фону, розміру шрифту та іншого, мало не в кожному другому HTML-тегу. Але при цьому, якщо вам захочеться змінити той же колір у якихось елементів відразу на всіх сторінках сайту, то вам треба буде внести всього одна зміна в одному файлі, а не правити код кожної сторінки, витрачаючи на це багато часу. Цікаво, правда? Природно при скороченні коду і сайт буде набагато швидше завантажуватися на комп'ютери користувачів, що теж є важливим фактором.

А тепер давайте розглянемо такий простий приклад:

Приклад використання CSS

Результат в браузері (без стилів)

Результат зі стилями

Ще один результат зі стилями

Якщо ви вже освоїли підручник HTML. то в цьому прикладі вам може бути незнайомий тільки один тег - . В даному випадку він служить для підключення стилів, які знаходяться в файлі style.css. У першому результаті прикладу цей файл був порожній, тому применился тільки HTML. У другому результаті в style.css було додано трохи стилів, а в третьому - ще трохи. При цьому сам файл з HTML-сторінкою не змінювався зовсім.

Звичайно, щоб показати вам цей приклад мені довелося імітувати додавання стилів, але суті це не міняє.

• Як зробити сайт
  Самому безкоштовно
• Підручник HTML
  Для початківців
• Підручник CSS
  Для новаків
• Довідники
  За HTML і CSS
• приклади
  HTML і CSS
• посилання
  Корисні сайти для веб-майстрів
• інструментарій
  Програми для створення сайтів