Помогни ни да направим Uroci.net по - богат! Добави урок

Структура и понятия в CSS: 1-ва част (Основни понятия)

taffch0   трудност:    видян: 15842

В първия пример бях споменал, че структурата на CSS файла включва названието на елемента, за който ще се задават параметрите - в примера това беше body, и след това самите параметри, които се ограждат в големи скоби - { }. Практически всеки таг от HTML - например table, p, h1, h2 и т.н. - може да бъде на мястото на body и да му се зададат някакви параметри. HTML таговете, за които се задават параметрите, се наричат в CSS селектори, а кода, поставен в големите скоби, се състои от атрибути и зададените им стойности. Т.е. типичната структура на CSS кода е

селектор {атрибут: стойност}

В скобите може да се затвори един атрибут или няколко атрибута
с техните стойности, като в такъв случай те се отделят с точка и запетая.

В примера беше използван кода

body
{
background-color: #000000;
font-family: arial, sans-serif, helvetica;
font-size: 12px;
color: #cccccc
}


В този случай имаме един селектор - body. Кода, заключен между двете скоби, е съставен от атрибутите background-color, font-family, font-size и color, а на всеки атрибут е зададена някаква стойност - в случая например стойността на атрибута color e #cccccc и т.н. Тъй като имаме зададени няколко атрибута с техните стойности, те са отделени един от друг чрез точка и запетая.

Тъй като в този пример селектора е body, то всички зададени праметри ще важат за секцията body на HTML страницата. Ако на мястото на body сложим например селектора table, тогава декларираните атрибути и техните стойности ще важат за всяка таблица, която имаме в HTML документите:

table
{
background-color: #000000;
font-family: arial, sans-serif, helvetica;
font-size: 12px;
color: #cccccc
}


Специално що се отнася до декларирането на цветовете има и още едно улеснение. В случая на атрибута background-color е зададена стойност #000000 (черен цвят) и на атрибута color е зададена стойност #cccccc (бледосив цвят). Те биха могли да се декларират и така:

background-color: #000;
color: #ccc


като по този начин ще се спести малко пространство, което може да се окаже и голямо, ако се пише дълъг документ с много код за цветове. CSS позволява двойките еднакви букви или цифри от 16-тичната бройна система да се заменят с едната от тях, т.е. кода #ff0000 може да се напише #f00, кода #334455 може да бъде #345 и т.н.

Преписването е забранено.



Коментари (1)

MultiWinterboy на 05.02 2011 в 00:14ч.
:) cool

Регистрирайте се, за да добавите коментар


Калдейта ЕООД - © 2003-2010. Всички права запазени.
Препоръчваме: IT Новини