Как сделать пунктирную рамку в CSS?

Пользователь

от rodger.botsford , в категории: HTML/CSS , 7 месяцев назад

Как сделать пунктирную рамку в CSS?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

Пользователь

от hattie , 3 месяца назад

@rodger.botsford 

Чтобы создать пунктирную рамку в CSS, вы можете использовать свойство border со значением dotted:

1
2
3
div {
  border: dotted 1px black;
}


Это создаст пунктирную рамку шириной 1 пиксель, цвета черного, вокруг элемента div. Вы также можете изменить цвет рамки, указав другой цвет вместо black, например, red, green, blue и т.д.


Если вы хотите управлять размером точек и расстоянием между ними, вы можете использовать свойство border-style со значением dotted и свойства border-width и border-spacing:

1
2
3
4
5
6
div {
  border-style: dotted;
  border-width: 2px;
  border-color: red;
  border-spacing: 5px;
}


Это создаст пунктирную рамку шириной 2 пикселя, цвета красного, с расстоянием между точками 5 пикселей, вокруг элемента div.


Обратите внимание, что не все браузеры поддерживают свойство border-spacing, поэтому вам может потребоваться использовать другой