CSS Інтро

Що таке CSS?

• CSS розшифровується як Cascading Style Sheets (каскадні таблиці стилів)
• CSS описує як HTML елементи мають відображатись на екрані, папері або інших носіях
• CSS економлять багато часу. Вони можуть контролювати макет кількох вебсторінок одночасно
• Зовнішні таблиці стилів зберігаються в окремих CSS файлах

CSS демо - Одна HTML сторінка - кілька стилів!

Тут ми покажемо одну HTML-сторінку з чотирма різними таблицями стилів. Натисніть на посилання "Таблиця стилів 1", "Таблиця стилів 2", "Таблиця стилів 3", "Таблиця стилів 4 нижче, щоб побачити різні стилі:

Навіщо використовувати CSS?

CSS використовується для визначення стилів ваших вебсторінок, включаючи дизайн, макет та варіанти відображення для різних пристроїв та розмірів екрану.

CSS вирішив велику проблему

HTML НІКОЛИ не повинен містити теги для форматування вебсторінки!

HTML був створений для опису змісту вебсторінки, наприклад:

<h1>Це заголовок</h1>

<p>Це параграф.</p>

Коли такі теги, як <font> та атрибути кольору були додані в специфікацію HTML 3.2, це стало жахіттям для веб-розробників. Розробка крупних вебсайтів, на яких шрифти та інформація про колір додавались на кожну сторінку, стала довготривалим та дуже вартісним процесом.

Щоб вирішити цю проблему, Консорціум World Wide Web (W3C) створив CSS.

CSS видалив форматування стилів із HTML-сторінок!

CSS економить багато роботи!

Описи стилю зазвичай зберігаються у зовнішніх файлах з розширенням .css.

За допомогою зовнішнього файлу таблиці стилів ви можете змінити зовнішній вигляд всього сайту, змінивши лише один файл css!

Примітка. Варто зазначити, що більшість сучасних веббраузерів продовжують підтримувати старі вебсайти, які були зроблені згідно специфікацій HTML3.2 та HTML4, де використовувались теги форматування безпосередньо в файлах HTML, та відображають їх досить правильно. Але при створенні сучасних вебсайтів РЕКОМЕНДУЄТЬСЯ використовувати форматування лише в окремих CSS-файлах, які підключаються до файлів HTML!