Как получить пунктирную границу в HTML?

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

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

Как получить пунктирную границу в HTML?

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

1 ответ

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

от adrien.waters , 3 месяца назад

@ian.heidenreich 

Чтобы создать пунктирную границу в HTML, вы можете использовать свойство border-style со значением dotted. Например:

1
2
3
4
5
6
7
8
9
<style>
.dotted-border {
  border-style: dotted;
}
</style>

<div class="dotted-border">
  Этот элемент имеет пунктирную границу.
</div>


Вы также можете указать ширину границы с помощью свойства border-width, а также цвет с помощью свойства border-color. Например:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
<style>
.dotted-border {
  border-style: dotted;
  border-width: 2px;
  border-color: blue;
}
</style>

<div class="dotted-border">
  Этот элемент имеет пунктирную границу с шириной 2 пикселя и цветом синего цвета.
</div>


Вы также можете применить стили к конкретной стороне границы, указав свойство border-top-style, border-right-style, border-bottom-style, или border-left-style, в зависимости от того, какую сторону вы хотите оформить. Например:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
<style>
.dotted-border {
  border-top-style: dotted;
  border-right-style: solid;
  border-bottom-style: dashed;
  border-left-style: double;
}
</style>

<div class="dotted-border">
  Этот элемент имеет пунктирную