Справочник по CSS : Границы элементов

Материал из Справочник Web-языков.

Перейти к: навигация, поиск
Главная  ::. CSS  ::. Границы элементов

Содержание

[править] border

Задает все свойства границ элемента страницы в один прием.

Заменяет атрибуты border-color, border-style и border-width. Значения этих атрибутов могут располагаться в любом порядке.

border: [{border-color}] [{border-style}] [{border-width}];

Значение по умолчанию medium none.

Поддерживается IE начиная с 4.0

[править] border-color

(IE)

Задает цвет всех границ элемента страницы.

Заменяет атрибуты border-top-color, border-right-color, border-bottom-color и border-left-color.

border-color: {border-top-color} [{border-right-color}] [{border-bottom-color}] [{border-left-color}];

Может быть задано от одного до четырех значений. Если задано одно значение, оно применяется ко всем четырем границам. Если задано два значения, первое относится к верхней и нижней границам, а второе - к левой и правой. Если задано три значения, то первое применяется к верхней границе, второе - к левой и правой, третье - к нижней.

Поддерживается IE начиная с 4.0


(NN)

Задает цвет границ элемента страницы.

border-color: none|{Цвет};

Может быть задано либо цветное значение, либо none, обозначающее отсутствие границ.

Поддерживается NN начиная с 4.0

[править] border-top-color

Задает цвет верхней границы элемента страницы.

border-top-color: {Цвет};

Поддерживается IE начиная с 4.0

[править] border-bottom-color

Задает цвет нижней границы элемента страницы.

border-bottom-color: {Цвет};

Поддерживается IE начиная с 4.0

[править] border-left-color

Задает цвет левой границы элемента страницы.

border-left-color: {Цвет};

Поддерживается IE начиная с 4.0

[править] border-right-color

Задает цвет правой границы элемента страницы.

border-right-color: {Цвет};

Поддерживается IE начиная с 4.0

[править] border-style

Задает тип сразу всех границ элемента страницы в один прием.

Заменяет атрибуты border-top-style, border-right-style, border-bottom-style и border-left-style.

border-style: none|dotted|dashed|solid|double|groove|ridge|inset|outset;
  • border-style: none; - запрещает рисование границы (значение по умолчанию);
  • border-style: dotted; - рисует точечную линию (не поддерживается в NN);
  • border-style: dashed; - рисует штриховую линию (не поддерживается в NN);
  • border-style: solid; - рисует сплошную линию;
  • border-style: double; - рисует двойную сплошную линию;
  • border-style: groove; - рисует трехмерную вдавленную границу;
  • border-style: ridge; - рисует трехмерную выпуклую границу;
  • border-style: inset; - рисует трехмерную "ступеньку вверх";
  • border-style: outset; - рисует трехмерную "ступеньку вниз".

Поддерживается IE и NN начиная с 4.0

[править] border-top-style

Задает тип верхней границы элемента страницы.

  • border-top-style: none|dotted|dashed|solid|double|groove|ridge|inset|outset;
  • border-top-style: none; - запрещает рисование границы (значение по умолчанию);
  • border-top-style: dotted; - рисует точечную линию (не поддерживается в NN);
  • border-top-style: dashed; - рисует штриховую линию (не поддерживается в NN);
  • border-top-style: solid; - рисует сплошную линию;
  • border-top-style: double; - рисует двойную сплошную линию;
  • border-top-style: groove; - рисует трехмерную вдавленную границу;
  • border-top-style: ridge; - рисует трехмерную выпуклую границу;
  • border-top-style: inset; - рисует трехмерную "ступеньку вверх";
  • border-top-style: outset; - рисует трехмерную "ступеньку вниз".

Поддерживается IE начиная с 4.0

[править] border-bottom-style

Задает тип нижней границы элемента страницы.

border-bottom-style: none|dotted|dashed|solid|double|groove|ridge|inset|outset;
  • border-bottom-style: none; - запрещает рисование границы (значение по умолчанию);
  • border-bottom-style: dotted; - рисует точечную линию (не поддерживается в NN);
  • border-bottom-style: dashed; - рисует штриховую линию (не поддерживается в NN);
  • border-bottom-style: solid; - рисует сплошную линию;
  • border-bottom-style: double; - рисует двойную сплошную линию;
  • border-bottom-style: groove; - рисует трехмерную вдавленную границу;
  • border-bottom-style: ridge; - рисует трехмерную выпуклую границу;
  • border-bottom-style: inset; - рисует трехмерную "ступеньку вверх";
  • border-bottom-style: outset; - рисует трехмерную "ступеньку вниз".

Поддерживается IE начиная с 4.0

[править] border-left-style

Задает тип левой границы элемента страницы.

border-left-style: none|dotted|dashed|solid|double|groove|ridge|inset|outset;
  • border-left-style: none; - запрещает рисование границы (значение по умолчанию);
  • border-left-style: dotted; - рисует точечную линию (не поддерживается в NN);
  • border-left-style: dashed; - рисует штриховую линию (не поддерживается в NN);
  • border-left-style: solid; - рисует сплошную линию;
  • border-left-style: double; - рисует двойную сплошную линию;
  • border-left-style: groove; - рисует трехмерную вдавленную границу;
  • border-left-style: ridge; - рисует трехмерную выпуклую границу;
  • border-left-style: inset; - рисует трехмерную "ступеньку вверх";
  • border-left-style: outset; - рисует трехмерную "ступеньку вниз".

Поддерживается IE начиная с 4.0

[править] border-right-style

Задает тип правой границы элемента страницы.

border-right-style: none|dotted|dashed|solid|double|groove|ridge|inset|outset;
  • border-right-style: none; - запрещает рисование границы (значение по умолчанию);
  • border-right-style: dotted; - рисует точечную линию (не поддерживается в NN);
  • border-right-style: dashed; - рисует штриховую линию (не поддерживается в NN);
  • border-right-style: solid; - рисует сплошную линию;
  • border-right-style: double; - рисует двойную сплошную линию;
  • border-right-style: groove; - рисует трехмерную вдавленную границу;
  • border-right-style: ridge; - рисует трехмерную выпуклую границу;
  • border-right-style: inset; - рисует трехмерную "ступеньку вверх";
  • border-right-style: outset; - рисует трехмерную "ступеньку вниз".

Поддерживается IE начиная с 4.0

[править] border-width

Задает толщину всех границ элемента страницы.

Заменяет атрибуты border-top-width, border-right-width, border-bottom-width и border-left-width.

border-width: {border-top-width} [{border-right-width}] [{border-bottom-width}] [{border-left-width}];

Может быть задано от одного до четырех значений. Если задано одно значение, оно применяется ко всем четырем границам. Если задано два значения, первое относится в верхней и нижней границам, а второе - к левой и правой. Если задано три значения, то первое применяется к верхней границе, второе - к левой и правой, третье - к нижней.

Толщина может быть задана числовым значением. Также доступны три предопределенных значения: thin, medium, thick, рисующие тонкую, среднюю и толстую линию соответственно.

Значение по умолчанию medium.

Поддерживается IE и NN начиная с 4.0

[править] border-top-width

Задает толщину верхней границы элемента страницы.

border-top-width: medium|thin|thick|{Толщина};

Толщина может быть задана числовым значением. Также доступны три предопределенных значения: thin, medium, thick, рисующие тонкую, среднюю и толстую линию соответственно.

Значение по умолчанию medium.

Поддерживается IE и NN начиная с 4.0

[править] border-bottom-width

Задает толщину нижней границы элемента страницы.

border-bottom-width: medium|thin|thick|{Толщина};

Толщина может быть задана числовым значением. Также доступны три предопределенных значения: thin, medium, thick, рисующие тонкую, среднюю и толстую линию соответственно.

Значение по умолчанию medium.

Поддерживается IE и NN начиная с 4.0

[править] border-left-width

Задает толщину левой границы элемента страницы.

border-left-width: medium|thin|thick|{Толщина};

Толщина может быть задана числовым значением. Также доступны три предопределенных значения: thin, medium, thick, рисующие тонкую, среднюю и толстую линию соответственно.

Значение по умолчанию medium.

Поддерживается IE и NN начиная с 4.0

[править] border-right-width

Задает толщину правой границы элемента страницы.

border-right-width: medium|thin|thick|{Толщина};

Толщина может быть задана числовым значением. Также доступны три предопределенных значения: thin, medium, thick, рисующие тонкую, среднюю и толстую линию соответственно.

Значение по умолчанию medium.

Поддерживается IE и NN начиная с 4.0

[править] border-top

Задает все свойства верхней границы элемента страницы за один прием.

Заменяет атрибуты border-top-color, border-top-style и border-top-width. Значения этих атрибутов могут располагаться в любом порядке.

border-top: [{border-top-color}] [{border-top-style}] [{border-top-width}];

Значение по умолчанию medium none.

Поддерживается IE начиная с 4.0

[править] border-bottom

Задает все свойства нижней границы элемента страницы за один прием.

Заменяет атрибуты border-bottom-color, border-bottom-style и border-bottom-width. Значения этих атрибутов могут распологаться в любом порядке.

border-bottom: [{border-bottom-color}] [{border-bottom-style}] [{border-bottom-width}];

Значение по умолчанию medium none.

Поддерживается IE начиная с 4.0

[править] border-left

Задает все свойства левой границы элемента страницы за один прием.

Заменяет атрибуты border-left-color, border-left-style и border-left-width. Значения этих атрибутов могут распологаться в любом порядке.

border-left: [{border-left-color}] [{border-left-style}] [{border-left-width}];

Значение по умолчанию medium none.

Поддерживается IE начиная с 4.0

[править] border-right

Задает все свойства правой границы элемента страницы за один прием.

Заменяет атрибуты border-right-color, border-right-style и border-right-width. Значения этих атрибутов могут распологаться в любом порядке.

border-right: [{border-right-color}] [{border-right-style}] [{border-right-width}];

Значение по умолчанию medium none.

Поддерживается IE начиная с 4.0

[править] border-collapse

Задает, будут ли границы ячеек и общая граница таблицы сливаться в одну или нет.

Применяется только для тега <TABLE>.

border-collapse: separate|collapse;
  • border-collapse: separate; - разделяет границу табилицы и границы ее ячеек (значение по умолчанию);
  • border-collapse: collapse; - объединяет их.

Поддерживается IE начиная с 5.0

Личные инструменты
2.78354692459