Какво представляват каскадните набори стилове?
Стилът е набор от визуални характеристики, които
може да бъдат приложени към даден HTML таг, за да се промени неговото
представяне.Един стил се състои от набор от CSS свойства със зададени стойности
във формата свойство:стойност. Пример:
background:
#dcdcdc;
height:
50px;
Същинската декларация за всеки отделен тип таг се
нарича правило (rule), а сборът от тези правила -
таблица със стилове (style sheet).
Името на тага от своя страна се нарича селектор (selector)
за правилото.
Така следващата дефиниция е едно правило:
body
{
margin:
0px;
padding:
0px;
text-align:
center;
background:
url(../design/tile.gif);
}
Body е
селектор за правилото, а блокът:
margin: 0px;
padding: 0px;
text-align: center;
background: url(../design/tile.gif);
представлява таблица със стилове.Така че една
таблица със стилове се състои от сбор от правила, всяко от които е асоциирано с
даден таг посредством селектор.
Какво означава "каскадни"?
Каскадата като понятие загатва за преминаване от
едно ниво към следващо, по-долно. Понякога един HTML
документ се визуализира стъпаловидно. Всяка стъпка представлява един дъщерен
елемент, като за нея може да се каже, че съдържа всички елементи, намиращи се
на по-ниско ниво.
Един стил, който е приложен на дадена стъпка, се
отразява и на всички елементи в тази стъпка. Или казано по друг начин,
приложеният стил влияе не само върху конкретния елемент, но и върху всички
негови наследници. Оттук и понятието каскадни стилове.
Що е стил? Защо са необходими?
CSS (от
английското Cascading Style Sheets) са следствие на продължителното развитие на HTML
и ни дават възможност да преминем към следващо ниво на представяне на
информацията. Те ни дават възможност да разделим смисловото съдържание на
страницата от неговото оформление.
Както мнозина от нас си спомнят, в първите версии
на стандарта на HTML нямаше предвидени никакви
средства за управление на външния вид на информацията. Общата концепция за
хипертекста беше насочена към достъпността на информацията за всякакви
устройства, способни да възпроизвеждат текст. За оформянето се препоръчваше
използването само на логически тагове, определящи заглавия, подзаглавия,
списъци, абзаци, цитати и т.н. - тоест, тези елементи, които съставляват
структурата на документа. Интерпретацията на вънешния вид остава изцяло на
съвестта на крайния терминал.
От тогава много неща се промениха и стандартният HTML
загуби първоначалната си стройност. Първоначално Netscape добави
"подобрени тагове", които дадоха възможност по-широко да се управлява
външния вид на представяната информация. След това по подобен начин постъпи и
Microsoft. В резултат на това HTML се оказа по същество смес от логически и
оформителски тагове, несъвместими разширения и напълно престана да отговаря на
първоначалната концепция - да представя информацията на произволно устройство
независимо от неговите характеристики.
В резултат на това беше предприета широкомащабна
стандартизация. По този начин на бял свят се появи стандартът HTML
3.2. той не е революционен, а само постави по местата им всички
нововъведения и въведе общи препоръки за производителите на браузери.
Революционни изменения бяха въведени в новия стандарт - HTML
4.0 или, както беше наречен, Dynamic HTML.
В обръщение бяха въведени слоеве, стилови таблици и универсален обектен модел
на браузера.
В новия стандарт се прави опит да се върнат
нещата към първоначалната концепция на HTML. Четвъртата версия, както и
първата, препоръчва да се създават страници по такъв начин, че да могат да
бъдат възпроизведени на всяко устройство и браузер.
По какъв начин се решава проблема с външния вид
на представяне на информацията? Точно в това се заключава революционния характер
на подхода. Цялото оформление се препоръчва да се изнесе във вънешен стилов
файл. Основната страница ще съдържа само информация и препратки към
необходимите стилове.
При показване на страница на конкретно устройство
или браузер трябва да бъде задействана съответстващата на случая стилова
таблица. За мобилен телефон и монитор на компютър те, разбира се, трябва да
бъдат различни. В първия случай ние използваме минимално оформление, което
позволява да се представи информацията най-оптимално и компактно. Във втория
случай имаме на разположение цялото богатство на шрифтовото и цветово
оформление.
Стиловта таблица се създава еднократно при
създаване на сайта за всяко от устройствата, на които се планира представянето
на информацията. Стиловта таблица може да бъде една и за целия сайт. И,
следователно, не е нужно да се повтарят едни и същи описания на стилове на
всяка от страниците.
Правилно проектиран сайт
Разполагането на цялата информация за стиловете в
един външен файл ни дава и други полезни възможности - дори с промяна само на
един (!) стилов файл, ние можем за броени секунди да сменим дизайна на целия
сайт. При това никакви други преработки няма да са необходими. Разбира се това
е възможно само в случай, че първоначално сайтът е бил проектиран правилно.
Целта на web разработчиците е да премахнат
презентацията от HTML кода, оставяйки го чист и
разбираем.
Предимствата на това са:
- По-голяма достъпност на различни видове устройства (браузери)
- Лесно обновяване на сайта - по добре да актуализраме 1 css файл,
отколкото всичките html файлове
- По-малък размер на кода. Зтова води след себе си по-малкия размер
на изходния файл и следователно по-бързото му зареждане.
- По-малкият размер на кода позволява много по-лесна обработка и
обновяване
- Повече контрол над кода
