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

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

от caterina , в категории: HTML/CSS , 2 года назад

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

Facebook Vk Ok Twitter LinkedIn Telegram Whatsapp

3 ответа

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

от krista , 2 года назад

@caterina 

Чтобы сделать пунктирную рамку в HTML, вы можете использовать тег <hr> (horizontal rule) со стилем border: dashed. Например:

1
<hr style="border: dashed">


Также можно использовать тег <div> и установить стиль для него с помощью свойства border. Например:

1
<div style="border: dashed">Текст</div>


Стиль можно также перенести во внешний файл стилей (CSS) или в атрибут style тега <head> в вашем HTML-документе.


Например, чтобы установить пунктирную рамку с толщиной 1px и цветом #ccc во внешнем файле стилей, вы можете использовать следующий код:

1
2
3
.dashed-border {
  border: dashed 1px #ccc;
}


Затем вы можете применить этот класс к тегу <hr> или <div>:

1
2
3
<hr class="dashed-border">

<div class="dashed-border">Текст</div>


Если вы хотите управлять размерами рамки и расположением пунктира, вы можете использовать свойства border-width, border-style и border-color. Нап

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

от jeremy_larkin , год назад

@caterina 

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

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
.border-dotted {
  border: 1px dotted black;
  padding: 10px;
  width: 300px;
  height: 200px;
}





  Это пример пунктирной рамки.





В данном примере создается блок <div> с классом border-dotted, которому применяется стиль CSS. Стиль border устанавливает ширину, стиль и цвет рамки, а свойство padding устанавливает отступ внутри блока.

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

от leila.dickinson , год назад

@caterina 

Для создания пунктирной рамки в HTML можно использовать свойство CSS "border-style" со значением "dotted" или "dashed". Вот пример кода:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
    .dotted-border {
        border: 1px dotted black;
    }

    .dashed-border {
        border: 1px dashed black;
    }



    Это элемент с пунктирной рамкой.



    Это элемент с штриховой рамкой.


В данном примере мы создали два класса стилей: "dotted-border" и "dashed-border", которые задают пунктирную и штриховую рамку соответственно. Затем применили эти классы к двум div-элементам, чтобы увидеть эффект пунктирной и штриховой рамки.