> Découvrez trajetalacarte.com : site de covoiturage professionnel !

Les bordures en CSS

Introduction
Vous pouvez définir la couleur de vos tableaux en css, la taille dans votre code CSS.
Héritage Il n'y pas de notion d'héritage pour les marges (voir notion d'héritage sur ce lien)

Couleur de la bordure

Vous pouvez définir la couleur de la bordure dans un tableau par exemple :
border-color: valeur;
Valeurs possibles:
  • Nom de la couleur
  • Valeur hexadecimal
  • Code RGB
  • transparent

Voir un exemple

Effet simple sur les bordures

Vous pouvez définir des effets simples avec du css comme une bordure en pointillé.
border-style: valeur;
Valeurs possibles:
  • dashed
  • dotted
  • double
  • groove
  • hidden
  • inset
  • none
  • outset
  • ridge
  • solid

Voir des exemples

A savoir Dans vos déclarations, définissez toujours la propriété de "border-style" avant la propriété de "border-color". En effet une bordure doit etre matérialisée avant d'etre coloriée !
Taille d'un bord
Vous pouvez définir la taille d'un bord avec la propriété :
border-width: valeur;
Valeurs possibles:
Voir des exemples

Bordure et position

Chaque cotés de votre éléments pour faire l'objet d'une apparence de votre choix !

Il est donc possible de déterminer un coté précis et définir son apparence :
border-bottom: 1px solid #333333;

Position et couleur:

Vous pouvez définir la couleur de la bordure du bas grace à la propriété : border-bottom-color
border-bottom-color: valeur;
Vous pouvez définir la couleur de la bordure de gauche grace à la propriété : border-left-color
border-left-color: valeur;
Vous pouvez définir la couleur de la bordure de droite grace à la propriété : border-right-color
border-right-color: valeur;
Vous pouvez définir la couleur de la bordure du haut grace à la propriété : border-top-color
border-top-color: valeur;

Position et effet sur la bordure

Vous pouvez définir un effet, comme pointillé sur la bordure du bas grace à la propriété :border-bottom-style
border-bottom-style: valeur;
Vous pouvez définir un effet pointillé sur la bordure de gauche grace à la propriété :border-left-style
border-left-style: valeur;
Vous pouvez définir un effet pointillé sur la bordure de droite grace à la propriété :border-right-style
border-right-style: valeur;
Vous pouvez définir un effet pointillé en css sur la bordure du haut grace a la propriété :border-top-style
border-top-style: valeur;

Position et taille de la bordure

Vous pouvez définir la taille de la bordure du bas en css grace à la propriété :border-bottom-width
border-bottom-width: valeur;
Vous pouvez définir la taille de la bordure gauche en css grace à la propriété :border-left-width
border-left-width: valeur;
Vous pouvez définir la taille de la bordure de droite en css grace à la propriété :border-right-width
border-right-width: valeur;
Vous pouvez définir la taille de la bordure du haut en css grace à la propriété :border-top-width
border-top-width: valeur;

Voir des exemples

Définir un Ordre & Listes désordonnéess en CSS >>>