2. Структура сss-кода
Любой код начинает с открывающего тега стиля:
и завершается, соответсвенно, закрывающим
Ни в коем случае не забывайте о закрывыющем теге, иначе вы рискуете "поломать" себе весь форум.
Между открывающим тегом и закрывающим распологается сам css-код для одного или нескольких элементов.
<style type="text/css">
#name {parameter: argument;}
</style>
Мы рассмотрим вариант с кодом для одного элемента и разберем его на составные части:
___
# - значение определяющее вид селектора.
Существует всего 3 вида обозначения:
1. #name - диеза, для элементов имя которых записано в html через селектор id, т.е. для элемента <div id="name"> правильной является запись #name
2. .name - точка, для элементов имя которых записано в html через селектор class, т.е. для элемента <div class="name"> правильной является запись .name
3. name - имя без каких-либо дополнительных обозначений используется для тегов, например: <body></body>, <span></span>, <ul></ul>, <li></li>, <a></a> и так далее.
___
name - имя элемента записаное в селекторе id, class или же название тега.
___
{ - октрывающая фигурная скобка, которая отделяет зону записи свойств элемента от имени элемента.
___
parameter: - это свойство элемента которое вы хотите регулировать, например: высота, ширина, цвет фона и т.д.
___
argument; - это значение свойства элемента, например: значение высоты в цифрах, или цвет фона. Окончание обозначается точкой с запятой о которой не стоит забывать, если вы хотите описать несколько свойств для элемента. Каждое новое свойство и аргумент для него отделяются от предыдушего по средствам этого символа. Например:
#name {parametr1: argument; parametr2: argument; parametr3: argument;}
___
} - закрывающая фигурная скобка, о которой так же не стоит забывать, если в вашем css-коде вы хотите описать свойства не для одного элемента.
Дополнение:
Если вы хотите назначить одинaковые свойства нескольким элементам, не обязательно дублировать свойства для каждого по нескольку раз, достаточно записать селекторы элементов через запятую.
Пример:
<style type="text/css">
#name1, #name2, #name3 {parameter: argument;}
</style>
____
Если вы хотите назначить разные свойства разным элементам, не обязательно создавать еще один отдельный код, достаточно записать селекторы по порядку, не забывая конечно о закрывющих фигурных скобках.
Пример:
<style type="text/css">
#name1 {parameter1: argument;}
#name2 {parameter2: argument;}
#name3 {parameter3: argument;}
</style>
