Gestion des bordures en CSS
Bordures, couleurs, tailles, tableaux

Accueil >
coder en css border color style width

A découvrir les boutons de manchette Geek :) - Des idées de cadeaux à petits prix :)

Les bordures en CSS : tableau rapide avec CSS !

Vous pouvez définir la couleur de vos tableaux en css, la taille dans votre code CSS.

border-color: Couleur de la bordure
border-style: Apparence de la bordure
border-width: Taille de la bordure

A savoir : 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 de border-color en CSS

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 d'un tableau 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

Liens vers d'autres sujets sur le CSS : [Bordure en CSS] - [Définir l'apparence sur une liste (puce

) en CSS] -

Le CSS en 3 questions/réponses - en bref

🖥️ C'est quoi HTML et CSS ?

Le CSS est un langage informatique utilisé pour mettre en forme les fichiers HTML sur un site web. Ainsi, les fichiers CSS permettent de gérer l'aspect graphique d'une page en HTML.

🤔 Qu'est-ce que le CSS ?

CSS est l'acronyme de « Cascading Style Sheets » c'est à dire « feuille de style en cascade ». Le CSS est un langage informatique permettant de mettre en forme des pages web (HTML ou XML).

📆 Différence entre CSS et CSS3 ?

CSS3 est la dernière version de CSS. Il fournit des capacités de type JavaScript. En plus de cela, il fournit également des fonctionnalités de développement mobile.