Как я могу установить границу css только с одной стороны?

Для данного div я хотел бы показывать только границу слева, справа, сверху или снизу.

В настоящее время у меня есть следующее, которое ставит границу со всех сторон:

#testdiv {
   border: 1px solid;
}

Что мне нужно сделать, чтобы иметь границу только с левой стороны?

Ответы

Ответ 1

#testdiv {
   border-left: 1px solid;
}

Смотрите документацию MDN на границе.

Ответ 2

    div{
    border-left:solid red 3px;
    border-right:solid violet 4px;
    border-top:solid blue 4px;
    border-bottom:solid green 4px;
    background:grey;
    width:100px; height:50px
}

DEMO

Ответ 3

Если вы хотите установить 4 стороны отдельно, используйте:

border-width: 1px 2em 5px 0; /* top right bottom left */
border-style: solid dotted inset double;
border-color: #f00 #0f0 #00f #ff0;

Ответ 4

Вы можете указать границу отдельно для всех границ, например:

#testdiv{
  border-left: 1px solid #000;
  border-right: 2px solid #FF0;
}

Вы также можете указать внешний вид границы и использовать отдельный стиль для верхней, правой, нижней и левой границ. например:

#testdiv{
  border: 1px #000;
  border-style: none solid none solid;
}

Ответ 5

Попробуйте это

#testdiv{
  border-left:1px solid;

}

Ответ 6

#testDiv{
    /* set green border independently on each side */
    border-left: solid green 2px;
    border-right: solid green 2px;
    border-bottom: solid green 2px;
    border-top: solid green 2px;
}