Comment puis-je définir une bordure css d'un seul côté?

Question

Pour un div donné, je voudrais uniquement afficher une bordure à gauche, à droite, en haut ou en bas.

Actuellement, j'ai ce qui suit, qui met une frontière de tous les côtés:

#testdiv {
   border: 1px solid;
}

Que dois-je faire pour avoir un frontière uniquement à gauche?

Answer 1

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

Voir la documentation MDN à la frontière .

Answer 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
}

[~ # ~] démo [~ # ~]

Answer 3

Si vous souhaitez définir 4 côtés séparément, utilisez:

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

Answer 4

Vous pouvez spécifier une bordure séparément pour toutes les bordures, par exemple:

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

Vous pouvez également spécifier l'aspect de la bordure et utiliser un style séparé pour les bordures supérieure, droite, inférieure et gauche. par exemple:

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

Answer 5

Essayez comme ça

#testdiv{
  border-left:1px solid;

}

Answer 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;
}