Главная | Регистрация | Вход | RSS | Вторник, 19.03.2024, 09:55 | |||||||||||||||||||||||||||||||||||||||||||||||||
КАК СОЗДАТЬ СВОЙ САЙТ | ||||||||||||||||||||||||||||||||||||||||||||||||||
Урок "10"Рамки в CSSДавайте в этом уроке поговорим о рамках. Основные свойства рамок в CSS следующие:
Свойство BORDER-WIDTH Это свойство задает толщину рамки. Значение обычно указывается в пикселях, но также можно указывать ключевыми словами thin (2px) , medium(4px) и thick(6px). Для лучшего понимания, сколько это один пиксель, смотрите рисунок ниже: На рисунке приведены значения ширины от 1 до 10 пикселей.
Свойство BORDER-COLOR Как вы поняли данное свойство определяет цвет рамки. Значение цвета задается обычным образом, т.е. например: "#ff3344", или "gold".
Свойство BORDER-STYLE Данное свойство определяет какого вида будет рамка. Ниже приведены 8 основных значений данного свойства. Все рамки в примере выполнены цветом gold и шириной 6 px .
Примечание:минимальная ширина рамки типа double должна равняться 3 px, иначе она будет отображаться некорректно. Вот пару примеров стилей: h1 { Или такой вариант: h1 { Сокращенная форма - border Как и в других свойствах, у рамки есть сокращенная форма border . В начале пишется толщина, затем после пробела стиль, а затем после пробела цвет. Предыдущий пример можно записать так: h1 { Примеры: Во всех перечисленных выше примерах, если добавить после слова border одно из ключевых слов (top, right, bottom, left) можно регулировать параметры рамки с разных сторон соответственно (верх, право, низ, лево). Ну вот например можно сделать так: h1 { Естественно намного красивее код будет выглядеть в сокращенном виде: h1 { Можно также комбинировать перечисленные выше свойства, ну например так: h1 { Думаю Вам все понятно, пора переходить к следующему уроку :) См. также Следующий - Урок 11: Поля (margin) и отступы (padding) |
|