Клуб мобильного творчества
Меню
jbak 25.01.13 в 21:46 #
Don't worry. Be happy.
В этом уроке я напишу о главном в CSS- синтаксисе.

Часть первая.


Вопрос: как выглядит синтаксис CSS-стиля?
Ответ: синтаксис выглядит так: селектор { атрибут: значение; }, где селектор- это элемент, для которого задается стиль, который находится в фигурных скобках ( "{...}"); атрибутом является название стиля (типа color), после атрибута обязательно ставится знак ":" и далее записывается значение (типа red ), после значения пишется знак ";" (типа red;). Например для того чтобы сделать цвет ссылки красным нужно ввести следующее:
a {
color:red;
}
(где "a"- это селектор, "color"- это атрибут, а "red"- это значение.) При создании собственного селектора, перед его названием ставится знак " . " Пример:
.blabla {
color:red;
}

Часть вторая

Вопрос: какие бывают селекторы и за что они могут отвечать?

Ответ:
→ селектор "body"- отвечает за тег
<body>
, то есть за основные настройки оформления страницы. Например для того чтобы определить цвет страницы нужно написать следующее:
body {
background–color: white;
}

→ селектор "a"- отвечает за оформление ссылки. Для того чтобы определить цвет ссылки нужно написать следующее:
a {
color:red;
}
;
→ селектор "img"- отвечает за оформление изображений. Например чтобы сделать выравнивание изображений по одной линии нужно ввести следующее:
img {
vertical–align:middle;
}


Пишем легкий CSS- код:

body {
background–color: white;/*цвет страницы*/
}
 a {
color:black;/*цвет ссылок*/
}
 img {
vertical–align:middle;/*выравнивание изображений*/
}


Первый урок окончен.
Изменил(а) jbak 26.01.13 в 13:40
Рейтинг: 0
seg0ro 25.01.13 в 22:48 #
¯\_(ツ)_/¯
Кратко и думаю понятно. Хорошо написал.
Рейтинг: 0
jbak 26.01.13 в 09:33 #
Don't worry. Be happy.
seg0ro, спасибо:)
Рейтинг: 0
fantast 26.01.13 в 09:39 #
Зловредный зайка
Да, действительно хорошо, даже я вспомнил кое-что.
Рейтинг: 0
Кухулин 26.01.13 в 09:51 #
don't tread on me
Не, ну для приличия можно было и переносы вставить. А то как-то все в одну строку...
Изменил(а) Кухулин 26.01.13 в 09:51
Рейтинг: 0
seg0ro 26.01.13 в 12:04 #
¯\_(ツ)_/¯
Урок добавлен в каталог в новую рубрику
Рейтинг: 0
jbak 26.01.13 в 13:28 #
Don't worry. Be happy.
Кухулин, спасибо)
Рейтинг: 0
jbak 26.01.13 в 13:40 #
Don't worry. Be happy.
Кухулин, сделано.
Рейтинг: 0