CSS : Les boîtes : border-style

Fonction border-style

border-top-style
Représente la bordure haut
   

border-right-style
Représente la bordure de droite
   

border-bottom-style
Représente la bordure du bas
   

border-left-style
Représente la bordure de gauche
   
Lorsque l'on veut imposer une bordure sur les 4 côtés, il est plus simple d'utiliser la fonction
border-style seule.

Ici encore, plusieurs façon d'utiliser la fonction s'offrent à nous
    1/ soit on indique un seul style pour les 4 côtés
        ex. : border-style: solid;
        ici une bordure solid s'appliquera aux 4 côtés de la boîte

    2/ soit on peut indiquer deux styles
        ex. : border-style: solid dotted;
        ici le premier style s'appliquera aux bordures haut et bas, et le second s'appliquera aux bordures gauche et droite

    3/ soit on met 3 styles
        ex. : border-style: solid dotted dashed;
        ici le premier correspond à la bordure haut, le second aux bordures gauche et droite et le dernier à la bordure bas

    4/ soit on met 4 styles
        ex. : border-style: solid dotted dashed double;
         et dans ce cas, les quatre bordures seront différentes, sachant que le premier correspond à la bordure haut, et que les autres s'appliquent en tournant dans le sens des aiguilles d'une montre.

Voici une représentation de ces 4 cas de figure, plus le cas none (pas de bordure)