наверх






Для установки у элемента рисованной рамки указывающая на его границу в веб-документе присутствуют два свойства, предназначенные для этого.

border


Свойство необходимо для установки рисованной рамки указывающая на на его границу в веб-документе. При этом имеется возможность установки рамки лишь с определенной стороны. Для установки свойства необходимо указать ширину рамки, тип линии и её цвет.
Ширину и цвет линии необходимо указывать в доступном для CSS формате.
Для ширины может быть px, %.
Цвет можно указать в формате RGB (Red Green Blue), либо в формате HTML HEX кода. Для перевода цвета из одного формата в другой можно использовать сервис конвертера цвета.

Синтаксис свойства border следующий:

border: Ширина Тип Цвет;

Однако значения можно задать и в любом другом порядке, главное разделить их через пробел.

Типы линий:



#fixed { 
  border:3px solid #498DFB;
}


Для установки рамки с разных сторон используются свойства ниже:

border-top - рамка сверху;
border-bottom - рамка снизу;
border-left - рамка слева;
border-right - рамка справа;

.storage { 
  border-right: 3px solid #498DFB;
  border-bottom: 2px dashed #498DFB;
}


outline


Универсальное свойство, необходимое для установки внешней линии у элемента. В отличии от border у данного свойства отсутствует возможность установки рамки лишь на определенных сторонах элемента. При этом синтаксис и типы линий у них одинаковы.

outline: 1px dotted #498DFB;


Дополнительно



Более подробно о свойстве borderчитать в библиотеке.
Более подробно о свойстве outlineчитать в библиотеке.

Информация в библиотеке про другие свойства из раздела "Граница" — ссылка.





Поделиться
Text-shadow генератор
Занимаетесь веб-разработкой? Полноценный кроссбраузерный text-shadow генератор с поддержкой нескольких теней.


Комментарии — 0


У вас нет прав для добавления комментария. Зарегистрируйтесь или авторизуйтесь.