Правило CSS content: ефективний спосіб налаштування веб-сторінки

Правило CSS content: ефективний спосіб налаштування веб-сторінки

Браузер так розуміє CSS: це система стилів відображення тегів сторінки. За час свого розвитку правила CSS змінилися, розширилися, наповнилися цікавими і практичними деталями. Правило CSS content - особливе, воно являє собою частину змісту "транслюваного" на сторінки, які визначив розробник.

Правило транслюваного уточнюючого контенту пов 'язане з псевдо-елементами:before и :after. Зміст цього правила "не потрапляє" в дерево DOM. Це універсально-ювелірний інструмент уточнення змісту сторінки еквівалентно всім сторінкам, які використовують конкретний стиль CSS.

По суті, будь-яке правило CSS - це варіант відображення інформації: колір, розмір, положення, інше. CSS content - це доповнення тегів HTML текстом, символами або ресурсами.

Синтаксис правил і застосування

За загальним правилом кожен елемент веб-сторінки містить свій візуальний зміст. Це не текст, графіка або що-небудь інше, тобто не обов 'язково саме це. Кожен тег HTML з 'являється на сторінці. Бачимо чи не бачимо він - це інше питання.

Прозорість тега - це теж складова позиція в дизайні, але не складова сторінки у вікні браузера. Не всі теги видно завжди, а деяким судилося бути видимими за певних обставин або тільки в конкретний час.

Суть: тег веб-сторінки - це сенс (зміст) і спосіб його відображення у вікні браузера. Зміст і його відображення - не обов 'язково одне і те ж, але обов' язково: вміст сторінки переглядач використовує для створення дерева її об 'єктів (DOM), яке потім відображає як передбачено правилами CSS.

У цьому прикладі показано, як просто доповнити смисловий елемент "номер телефону" текстом "" "тел.:"" перед і символом "" "" - після. При цьому застосування стилю scCallWay до будь-якого тегу на будь-якій сторінці призведе до еквівалентного результату.

Достатньо змінити правило CSS content - і HTML-теги за всіма сторінками зміняться адекватно. У цьому сенсі розробник отримує унікальний інструмент змінювати один і той же смисловий зміст відразу по всіх місцях застосування.

Деталі застосування правила уточнення контенту

Перш за все, це звичайне правило і звичайна логіка. Content type у CSS може бути будь-яким: текст, спеціальний символ або посилання на веб-ресурс. Зміст правила не потрапляє в DOM і діє, як годиться іншим правилам, CSS - пропонує стиль оформлення тегу HTML.

Не має значення які використовувати лапки. Однаково ефективні подвійні ("") і одинарні ('), але критично, який код використовувати для позначення спеціальних символів: тільки шістнадцятковий і тільки після зворотного слешу.

Розробник може використовувати ідею доповнення контенту максимально широко. Приклад іграшки з динамічною зміною карт, оформленої в системі стилів garry 's mod CSS content - приклад "глобального" застосування.

Тут не просто деталі одного тега, а спектр безлічі деталей за різними тегами, який динамічно можна змінити.

Кодування - питання сумісності

Не слід забувати: браузер і його JavaScript - ідеальне середовище та інструмент управління при проектуванні HTML-сторінок. Таблиця каскадних стилів (CSS) - це вже давно не просто система правил оформлення тегів сторінки.

Ідеально використовувати кодування UTF-8, але часто доводиться орієнтуватися на windows-1251. На практиці, не настільки суттєво, який варіант обрати, але важливо забезпечити однакове кодування за всіма файлами (* .php, * .js, * .css та ін.), що використовуються на сторінках сайту.

Єдина система кодування файлів важлива не тільки в контексті правила CSS content і кирилиці. Єдність і стабільність коду сторінки, скриптів і правил оформлення тегів робить надійним, комфортним і безпечним використання та розвиток веб-ресурсу. Це вірна ознака професійної розробки.

Динаміка сенсу на HTML-сторінці

Стилі CSS не пов 'язані з деревом об' єктів HTML-сторінки. Але це тільки відносно справедливе твердження. Не всі правила CSS можна "витягнути" для перевірки та використання JavaScript, але завжди можна встановити нове правило або нове значення.

Динамічні сайти (їх автори) не надто апелюють до традиційного використання зовнішніх файлів CSS. Розробники воліють створювати потрібні правила оформлення в міру необхідності.

Правило CSS content не обмежує уяву розробника. Тут може бути не тільки текст, картинка або спеціальний символ, а й посилання на URL. Можна послатися на інший стиль, змінити прозорість, застосувати трансформацію або накладання тегів один на одного.

Теги, як і стилі, в сучасному розумінні інтернет-програмування - системи умовностей, які можуть бути застосовані різними програмістами абсолютно непередбачуваним чином.