ВебТех Конспект лекций 2011 укр

Спадкування й перевизначення

Під час обговорення технічних специфікацій часто буває корисно добрати зміст назви. У назві прийнято точно визначати суть і призначення стандарту або специфікації. Опис стилів відображення елементів HTML-Розмітки звуться "Каскадні таблиці стилів". Зі словом "стилів" всі більш-менш зрозуміло. Під словом "таблиці" варто розуміти набір властивостей елемента розмітки, якому можна представити у вигляді рядка в таблиці властивостей, тобто елементи розмітки - рядка, а властивості - стовпці. А от слово "каскадні" вимагає пояснення.

По-перше, існує ієрархія елементів розмітки (дерево об'єктів на сторінці). По-друге, властивості цих об'єктів можуть успадковуватися. У такий спосіб у дереві об'єктів утвориться галузь, що веде до аркуша дерева - елементу розмітки, наприклад, елементу списку або параграфу. Його властивості визначаються елементами розмітки, у які вкладений елемент, і описателями стилю для даного елемента:

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

Це початок першого розділу, що зрушать

на 10 пикселов вправо щодо лівого

краю параграфа й на 10 пикселов долілиць

щодо стандартної границі параграфа.

<DIV STYLE="margin-left:10px;margin-top:20px;

text-indent:10px;font-style:italic;">

Це початок другого розділу, що

зрушать щодо попереднього розділу

на 10 пикселов, а щодо параграфа -

на 20 пикселов. Даний розділ має червону

рядок з відступом в 10 пикселов і зміщений

щодо попереднього розділу на 20

пикселов.

<LI>перший елемент списку

<LI>другий елемент списку

</UL>

Список зрушать щодо другого розділу

на 10 пикселов, а щодо поточного

параграфа - на 30 пикселов. Перший рядок не

є рядком початку параграфа, тому на

її відступ не поширюється (тільки в

Netscape).

</DIV>

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

Коли пояснення деякого феномена HTML-Розмітки розтягується на кілька параграфів, має сенс скористатися наведеною нижче графічною схемою побудови сторінки.

При використанні стилів діють наступні правила старшинства стилів:

Рис. 8.3.

спочатку застосовуються стилі браузера за замовчуванням;

стилі браузера за замовчуванням перевизначаються прилинкованими стилями (елемент LINK заголовка документа);
прилинковані стилі перевизначаються описами стилів в елементі STYLE;
стилі елемента STYLE перевизначаються атрибутом STYLE у кожному з елементів розмітки.

Не всі атрибути стилю можуть успадковуватися. Наприклад, "набивання" (відступ змісту елемента від його границь) елемента BODY не успадковуються вкладеними в нього елементами й визначається за замовчуванням або прописується для кожного елемента окремо. Алгоритми спадкування в різних броузерах різні, тому для єдності відображення елементів варто прописувати стиль по максимуму атрибутів.

Содержание