4

Абзацы отображаются без границы:

p.one {
  border-width: 2px;
}

p.two {
  border-width: thick;
}

p.three {
  border-width: 1px 4px 12px 3px;
}
<p class="one">
  Синтезатор
</p>
<p class="two">
  Синтезатор
</p>
<p class="three">
  Синтезатор
</p>

1
  • 2
    Ширину для border Вы задали, а сами border не обозначили.
    – meine
    9 янв 2019 в 14:29

2 ответа 2

7

Почему не работает border-width?

Потому что нужно задавать тип обводки - border-style: solid; Подробнее на htmlbook.ru

Тогда заработает и толщина обводки - border-width: 2px;

Цвет по-умолчанию черный, если нужен другой, то можно задать - border-color: #color;

Или все вместе записывается: border: 2px solid red;

div {
  width: 200px;
  height: 100px;
  
  border-width: 2px;
  border-style: solid;
  border-color: red;
}
<div></div>

1
  • 1
    @hug Цвет по-умолчанию, если не задан явно в border или border-color, то равен или наследует значение свойства color.
    – UModeL
    9 янв 2019 в 19:32
6

Универсальное свойство border позволяет одновременно установить толщину, стиль и цвет границы вокруг элемента. Значения могут идти в любом порядке, разделяясь пробелом, браузер сам определит, какое из них соответствует нужному свойству.

Синтаксис:

border: border-width || border-style || border-color;

Как написал @meine в комментариях, ширина для border задана, а сам border не обозначен.

Все работает:

p.one {
    border: solid black;
    border-width: 2px;
}
p.two {
    border: solid black;
    border-width: thick;
}
p.three {
    border: solid black;
    border-width: 1px 4px 12px 3px;
}
<p class="one">
   Синтезатор
  </p>
<p class="two">
   Синтезатор
</p>
<p class="three">
   Синтезатор
</p>

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.