мое новое расписание: пн-пт с 8.00 по 16.00 по москве, сб и вс - выходные; после 16.00 и на вых. отвечаю по возможности

Свойство outline-offset

Свойство outline-offset задает отступ внешней рамки - границы, которая не занимает места. Значением свойства служат любые единицы для размеров, кроме процентов. Значение по умолчанию: 0. Положительное значение сдвигает рамку наружу от элемента, отрицательное - вовнутрь.

Синтаксис

селектор { outline-offset: значение; }

Пример . Положительное значение

Рамка отступает от элемента (он выделен фоном):

<div id="elem"></div> #elem { outline-offset: 5px; outline-width: 1px; outline-style: solid; outline-color: black; background-color: #e4f1ed; width: 300px; height: 100px; }

:

Пример . Отрицательное значение

Рамка находится внутри элемента:

<div id="elem"></div> #elem { outline-offset: -10px; outline-width: 1px; outline-style: solid; outline-color: black; background-color: #e4f1ed; width: 300px; height: 100px; }

:

Пример . Отрицательное значение outline + border

Можно сделать такой интересный эффект (обратите внимание на толщину белого промежутка между границами, он 10px, а не 14, так как часть съел outline своей толщиной в 4px):

<div id="elem"></div> #elem { outline-offset: -14px; outline: 4px solid green; border: 4px solid red; width: 300px; height: 100px; }

:

Смотрите также

  • свойство outline-width,
    которое задает толщину рамки
  • свойство outline-style,
    которое задает стиль рамки
  • свойство outline-color,
    которое задает цвет рамки
  • свойство outline,
    которое является свойством сокращением для рамок