CSS color, style, width

» Bordures, couleurs, tailles, style

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 être matérialisée avant d'être 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 élements 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 grâce à la propriété : border-bottom-color
border-bottom-color: valeur;
Vous pouvez définir la couleur de la bordure de gauche grâce à la propriété : border-left-color
border-left-color: valeur;
Vous pouvez définir la couleur de la bordure de droite grâce à la propriété : border-right-color
border-right-color: valeur;
Vous pouvez définir la couleur de la bordure du haut grâce à 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 grâce à la propriété :border-bottom-style
border-bottom-style: valeur;
Vous pouvez définir un effet pointillé sur la bordure de gauche grâce à la propriété :border-left-style
border-left-style: valeur;
Vous pouvez définir un effet pointillé sur la bordure de droite grâce à la propriété :border-right-style
border-right-style: valeur;
Vous pouvez définir un effet pointillé en css sur la bordure du haut grâce à 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 grâce à la propriété :border-bottom-width
border-bottom-width: valeur;
Vous pouvez définir la taille de la bordure gauche en css grâce à la propriété :border-left-width
border-left-width: valeur;
Vous pouvez définir la taille de la bordure de droite en css grâce à la propriété :border-right-width
border-right-width: valeur;
Vous pouvez définir la taille de la bordure du haut en css grâce à la propriété :border-top-width
border-top-width: valeur;

Voir des exemples

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