border-color | Свойство CSS - Справочник CSS3 | Делай сайт
Приветствую Вас, Гость! Регистрация
Георгиевская ленточка
Вторник, 06.12.2016
Главная » Справочник CSS3 » Свойства границ


2D & 3D ТрансформацияСвойства контента
Свойства импортаСвойства углов
Свойства границСвойства анимации
ПсевдоклассыПсевдоэлементы
Свойства размераСвойства контура
Свойства переходаСвойства печати
Свойства тениСвойства отступов
Свойства текстаСвойства колонок
Свойства полейПозиционирование
Свойства интерфейсаТипы значений
Полезные статьиСвойства списка
Свойства шрифтаСвойства таблицы
Свойства фонаВендорные префиксы



Адаптивный сайт - aTmpl


border-color | Свойство CSS

Свойство border-color устанавливает цвет границ.




Свойство border-color устанавливает цвет для всех четырёх границ элемента.Значения цвета могут указываться любым цветовым кодом или именем,между задаваемыми значениями нужно делать пробел.Общее число значений применимых к одному элементу может быть от 1 до 4 на Ваше усмотрение.Свойство применимо ко всем элементам,создано в версии CSS1 но проходит валидацию согласно версии CSS3.




Дополнительные значения border-color


Значение
Описание
<Цвет>Цвет всех границ одинаковый
<Цвет><Цвет>Первое значение для верхней и нижней границы,второе для левой и правой границы элемента
<Цвет><Цвет><Цвет>Первое значение для верхней границы,второе для левой и правой границы,третье для нижней границы элемента
<Цвет><Цвет><Цвет><Цвет>Последовательно для верхней границы,затем правой,потом нижней,а потом левой границы элемента
transparentУстанавливает прозрачность границ для элемента
inheritНаследует значение от родителя

Свойство работает в браузерах




Пример применения свойства



<!DOCTYPE html>
<html lang="ru">
<head>
<title>Свойство border-clor</title>
<style type="text/css">
<!--
#color1 {
border:20px;
border-style:dotted;
border-color:#0ba1d5;
background:grey;
padding:30px;
color:white;
font-size:20px;
}
#color2 {
border:20px;
border-style:dotted;
border-color:#0ba1d5 red;
background:grey;
padding:30px;
color:white;
font-size:20px;
}
#color3 {
border:20px;
border-style:dotted;
border-color:#0ba1d5 red rgb(34,139,34);
background:grey;
padding:30px;
color:white;
font-size:20px;
}
#color4 {
border:20px;
border-style:dotted;
border-color:#0ba1d5 red rgb(34,139,34) yellow;
background:grey;
padding:30px;
color:white;
font-size:20px;
}
-->
</style>
</head>
<body>
<div id="color1">Применено 1 значение</div>
<br>
<div id="color2">Применено 2 значения</div>
<br>
<div id="color3">Применено 3 значения</div>
<br>
<div id="color4">Применено 4 значения</div>
</body>
</html>

Пример в действии




Поэкспериментируйте сами





Русские шрифты






Источник: http://www.w3.org/TR/CSS21/box.html#propdef-border-color
Категория: Свойства границ | Добавил: IZOTOP (30.03.2012) | Автор: Меренков Михаил W
Просмотров: 481 | Теги: css, свойство, style, цвет границ, border-color | Рейтинг: 0.0/0

Вопросов / Советов / Предложений - относящихся к материалу: 0

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]