Sommaire

Les Boîte:bordurebordures

Vous avez la possibilité d’appliquer des bordures sur les quatre côtés des boîtes avec la Boîte:borderpropriété border. Si vous souhaitez appliquer des bordures différentes sur chaque côté de la boîte, utilisez les propriétés border-top, border-right, border-bottom et border-left.

Les bordures utilisent trois propriétés individuelles : border-style pour le type de bordure, border-width pour l’épaisseur et border-color pour la couleur. Voici les valeurs possibles pour la propriété border-style : dotted, dashed, solid, double, groove, ridge, inset et outset.

Bien sûr, vous pouvez utiliser des propriétés différentes pour chaque côté ou identiques pour toutes les bordures. Dans ces syntaxes raccourcies, l’ordre des valeurs importe peu : border: 3px #c00 solid ; est équivalent à border: solid 3px #c00 ;

Voici un exemple simple :

<!doctype html> 
<html lang="fr"> 
<head> 
   <meta charset="UTF-8"> 
   <title>Titre de la page</title> 
   <style> 
       #p-un { 
           border: solid 3px #aaa ; 
       } 
       #p-deux { 
            ...