0
border-left: 1px solid #669966;
border-right: 1px solid #669966;
border-bottom: 1px solid #669966;
1
  • вообще не разбираюсь в css, но мне кажется что никак. Здесь обьявлены левая, правая и нижняя границы. Можно сделать одной строчкой (без учета положения) но границы будут везде, а вам не нужна сверху. Никак, ИМХО
    – user194625
    18 окт 2016 в 10:51

3 ответа 3

5
border: 1px solid #669966;
border-top: none;
7
  • Однако интересная штука - css
    – user194625
    18 окт 2016 в 10:55
  • я отмечу решением как самое короткое решение. но это костыли.
    – user208916
    18 окт 2016 в 11:43
  • @Khipster это не костыли) и было бы правильнее принять первый ответ от VenZell
    – Alex
    18 окт 2016 в 11:49
  • @Alex неочевидное использование правил это костыли.
    – user208916
    18 окт 2016 в 11:57
  • 1
    @Khipster, это очевидное использование правил. Нижеследующие правила при равном весе селекторов перезаписывают предыдущие. Поскольку перезаписывающее правило менее полное, чем первое, была уточнена только часть составного правила.
    – VenZell
    18 окт 2016 в 12:13
1

Идея: задать полную границу и обнулить лишнюю.
Вот пример реализации:

.test {
  border: 1px solid #669966;
  border-top: 0;
  /* Демо */
  width: 150px;
  height: 50px;
}
<div class="test"></div>

3
  • такой вариант ответа уже есть
    – Alex
    18 окт 2016 в 11:15
  • @Alex посмотрите на время. Мой дан раньше.
    – VenZell
    18 окт 2016 в 11:36
  • да, вы правы. этот тот случай когда решают секунды) Вам +
    – Alex
    18 окт 2016 в 11:40
1

Можно менять стиль и цвет в одном месте вместо трех.
border-width: top right bottom left;

div {
  border-width: 0px 1px 1px 1px;
  border-style: solid;
  border-color: #669966;
}
<div>div</div>

1
  • Способ рабочий, но короче ли он?
    – VenZell
    18 окт 2016 в 11:56

Ваш ответ

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