Как сделать окантовку в css

Для создания окантовки в CSS можно использовать свойство «border». Это свойство создает линию вокруг элемента и может быть использовано для создания различных эффектов границ.

Синтаксис свойства «border» имеет несколько значений:

border: [толщина] [стиль] [цвет];

где:

  • [толщина] — задает толщину линии границы в пикселях;
  • [стиль] — задает стиль линии границы (пунктирный, сплошной, двойной, прерывистый и т. д.);
  • [цвет] — задает цвет линии границы в формате, поддерживающемся CSS.

Например, чтобы создать черную линию окантовки вокруг элемента с толщиной равной 2 пикселя, можно использовать следующий CSS:

.my-element {
  border: 2px solid black;
}

Здесь мы задали толщину границы равной 2 пикселям, стиль — сплошную линию, цвет — черный. Если необходимо сделать границу двойной, можно использовать значение «double» для стиля границы:

.my-element {
  border: 2px double black;
}

Также, можно указывать значения для отдельных сторон границы, используя названия сторон: top, right, bottom, left. Например:

.my-element {
  border-top: 2px solid red;
  border-bottom: 2px solid blue;
  border-left: 2px solid green;
  border-right: 2px solid yellow;
}

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

реклама

Качественный хостинг сайтов

реклама

Получите консультацию нашего маркетолога

Изучит ваш проект, подберет подходящие услуги и тарифы

Получите бесплатный аудит

Наш специалист сделает базовый аудит вашего проекта и предложит персональные предложения.

Закажите услугу Как сделать окантовку в css

Наш специалист свяжется с вами в ближайшее время и уточнит детали