Анотація: Поняття каскадних таблиць стилів. Історія версій CSS. Відносини між множинними вкладеними елементами. Створення CSS стилів. Зв'язок HTML і CSS. Правила написання CSS. Каскадність CSS.
Інтернет значно спрощує пошук потрібної інформації, зворотною стороною, правда, є те, що більшість інтернет - джерел просто переказують один одного, якщо не дублюють повністю. Наприклад, набравши в пошуковику CSS. можна дуже швидко дізнатися, що це:
- каскадні таблиці стилів;
- використовується для управління зовнішнім виглядом інформації, що надається сайтом.
Дещо складніше дізнатися, як саме співвідноситься CSS з HTML. і ще складніше - чому для оформлення HTML документа не можна обійтися власними можливостями HTML. тим більше, що відповідні атрибути присутні в більшості тегів. В якості введення до даної лекції, ми постараємося внести деяку ясність в ці питання.
виникнення CSS
У другій лекції нашого курсу наведена коротка історія виникнення HTML. Частково написане зараз буде перетинатися з минулим матеріалом.
Перший стандарт HTML не містив структур, що дозволяють відображати текст будь-яким особливим чином, тобто не було ніяких засобів управління зовнішнім виглядом інформації. Первинним завданням було забезпечення доступності інформації для будь-яких пристроїв.
З подальшим поширенням HTML такі компанії, як Microsoft і Netscape стали впроваджувати свої власні теги або "покращувати" наявні саме з метою управління оформленням html - документів. Частина внесених змін прижилася і "пішла" в маси.
Після трапилося логічно неминуче, а саме, HTML став представляти собою набір несумісних між собою тегів і розширень. Результатом виправлення ситуації став стандарт HTML 3.2, "узаконив" ряд змін і усунув проблеми сумісності.
Таким чином, якщо дещо спростити, то можна сказати, що всі прийоми і теги. спрямовані на управління зовнішнім виглядом інформації, що надається, за своєю суттю, є атавізмом попередніх версій HTML.
Стандарт HTML 3.2 лише виправив ряд найбільш серйозних недоліків попередніх версій. Справжнім же рішенням проблеми з'явився стандарт HTML 4.0, в рамках якого було запропоновано відокремити опис структури html документа від його оформлення.
Якщо вже зовсім "ритися" в історії, то можна помітити, що і цей підхід не новий. SGML, на якому і грунтувалася перша версія HTML, в числі іншого передбачав наявність окремого "файлу стилів" документа.
Таким чином, виникнення каскадних таблиць стилів є закономірним результатом еволюційного розвитку стандартів HTML.
Суть і переваги CSS
CSS (Cascading Style Sheets - каскадні таблиці стилів) - мова опису зовнішнього вигляду документа, створеного за допомогою мови розмітки.
Концепція каскадних таблиць стилів була запропонована Хоконом Віум Лі - норвезьким вченим і фахівцем в області інформаційних технологій. які працювали в той час на консорціум W3C.
Як правило, CSS застосовується при роботі з HTML і XHTML мовами, і використовується для завдання кольорів, параметрів шрифтів, розташування блоків та інших елементів уявлення веб - сторінок.
До переваг використання CSS відносяться:
- централізоване управління відображенням безлічі документів за допомогою однієї таблиці стилів;
- спрощений контроль зовнішнього вигляду веб - сторінок;
- наявність розроблених дизайнерських технік;
- можливість використання різних стилів для одного документа, в залежності від пристрою, за допомогою якого здійснюється доступ до веб - сторінці.
Стандарт HTML 4.0 крім CSS затвердив і об'єктну модель браузера (Browser Object Model - BOM), про яку слід сказати окремо.
Об'єктна модель браузера описує вміст веб - документа, тобто сама модель є набором об'єктів, що описують вказане вміст. Оскільки BOM унікальна для кожного браузера. виникали проблеми з межплатформенному додатками. В кінцевому підсумку, на місце об'єктної моделі браузера прийшла об'єктна модель документа (Document Object Model - DOM), що описує стандарт уявлення веб - сторінок в вигляді набору об'єктів.
Коротка історія CSS
Опис виникнення CSS буде неповним, без короткої історії версій каскадних таблиць стилів.
- Управління способом відображення елемента на сторінці.
- Щоб визначити установки обтікання елемента текстом.
- Управління розмірами елемента.
- Управління зовнішніми і внутрішніми відступами елемента.
- Управління вертикальним вирівнюванням в таблицях.
- Управління стилями кордонів елементів.
- Управління форматуванням списків.
- Управління квітами тексту і фону.
- Управління параметрами шрифтів.
- Управління властивостями тексту.
- Управління міжрядковими інтервалами.
- Управління текстом невірно.
- Управління позиціонуванням елементів.
- Управління видимими областями елементів.
- Управління відображенням елементів, що виходять за межі заданих розмірів.
- Управління зовнішнім виглядом курсора.
- Управління розташуванням елементів по осі z (шари).
- Завдання мінімально і максимально можливих розмірів елемента.
- Управління відстанню між осередками таблиці.
- Управління стилями кордонів елемента (кожної кордону окремо).
- Управління розмірами елементів таблиць.
- Управління стилями лапок.
- Управління контентом при його друку.
- Управління звуковим оформленням контенту (гучність, паузи і т.п.).
- Виправлений ряд помилок CSS2.
- Змінилися деякі моменти, реалізація яких в переважній більшості браузерів відрізняється від специфікації CSS2.
- Прибрали особливості CSS2. які, в силу того, що не були реалізовані, були відкинуті CSS спільнотою.
- Видалили фрагменти CSS2. які будуть застарілими в CSS3.
- Додали деякі нові значення властивостей.
- Підтримка закруглені кути.
- Підтримка градієнтних кордонів.
- Управління тінями елементів.
- Підтримка можливості використання зображень, як кордонів елементів.
- Управління тінню тексту.
- Підтримка нестандартних шрифтів.
- Можливість зміни розмірів блоків користувачем.
- Можливість розбиття тексту на кілька колонок.
- Управління фоновими зображеннями.
В даний час стандарт CSS3 тільки розробляється. У зв'язку з цим нами перераховано лише ряд його нововведень. Детальніше з ними, на даному етапі, пропонується ознайомитися самостійно.