Assigne les quatre bordures d'un élément

p.dotted {border-style: dotted}           bordure faite de point
p.dashed {border-style: dashed}         bordure faite de tiret
p.solid {border-style: solid}                 bordure pleine
p.double {border-style: double}          bordure double
p.groove {border-style: groove}          bordure en forme de rainure
p.ridge {border-style: ridge}                bordure  effet 3d
p.inset {border-style: inset}                 bordure enfoncé
p.outset {border-style: outset} bordure  repoussé

Assigne différentes bordures pour tous les côtés

 

p.soliddouble {border-style: solid double}
p.doublesolid {border-style: double solid}
p.groovedouble {border-style: groove double}
p.three {border-style: solid double groove}

 

Assigne des couleurs aux bordures

La propriété "border-color" fonctionne seulement si elle est utilisé avec "border-style" qui doit le précédé.

/* toutes les bordures */
p.one
{
border-style: solid;
border-color: #0000ff
}

/* bordure du haut et bas et ensuite les coté */
p.two
{
border-style: solid;
border-color: #ff0000 #0000ff
}

/* dans l'ordre: haut, les deux cotés et le bas */
p.three
{
border-style: solid;
border-color: #ff0000 #00ff00 #0000ff
}

/* dans l'ordre: haut, droite,bas et gauche */
p.four
{
border-style: solid;
border-color: #ff0000 #00ff00 #0000ff rgb(250,0,255)
}

Assigne l'épaisseur de la bordure du bas

La propriété fonctionne seulement si elle est utilisé avec "border-style" qui doit le précédé.

p
{
border-style: solid;
border-bottom-width: 15px
}

Assigne l'épaisseur de la bordure de gauche

La propriété fonctionne seulement si elle est utilisé avec "border-style" qui doit le précédé.

p
{
border-style: solid;
border-left-width: 15px
}

Assigne l'épaisseur de la bordure de droite

La propriété fonctionne seulement si elle est utilisé avec "border-style" qui doit le précédé.

p
{
border-style: solid;
border-right-width: 15px
}

 

Assigne l'épaisseur de la bordure d'en haut

La propriété fonctionne seulement si elle est utilisé avec "border-style" qui doit le précédé.

p
{
border-style: solid;
border-top-width: 15px
}

Toutes les propriétés de la bordure d'en bas en une déclaration

 

p
{
border-bottom: medium solid #ff0000
}

Toutes les propriétés de la bordure de gauche en une déclaration

p
{
border-left: medium solid #ff0000
}

Toutes les propriétés de la bordure de droite en une déclaration

 

p
{
border-right: medium solid #ff0000
}

Toutes les propriétés de la bordure d'en haut en une déclaration

p
{
border-top: medium solid #ff0000
}

Toutes les propriétés de la largeur de la bordure en une déclaration

 

p.one
{
border-style: solid;
border-width: 5px
}
p.two
{
border-style: solid;
border-width: 5px 10px
}
p.three
{
border-style: solid;
border-width: 5px 10px 1px
}
p.four
{
border-style: solid;
border-width: 5px 10px 1px medium
}

Toutes les propriétés d'une bordure en une déclaration

p
{
border: medium double rgb(250,0,255)
}

Propriété	Description	Valeurs
border	Permet de mettre toutes les propriétés sur une seule déclaration	border-width border-style border-color
border-bottom	Permet de mettre toutes les propriétés de la bordure du bas en une déclaration	border-bottom-width border-style border-color
border-bottom-color	Définir la couleur de la bordure du bas	border-color
border-bottom-style	Définir le style de la bordure du bas	border-style
border-bottom-width	Définir la largeur de la bordure du bas	thin medium thick length
border-color	Définir la couleur des 4 bordures. Peut être de 1 à 4 couleurs	color
border-left	Permet de mettre toutes les propriétés de la bordure de gauche en une déclaration	border-left-width border-style border-color
border-left-color	Définir la couleur de la bordure de gauche	border-color
border-left-style	Définir le style de la bordure de gauche	border-style
border-left-width	Définir la largeur de la bordure de gauche	thin medium thick length
border-right	Permet de mettre toutes les propriétés de la bordure de droite en une déclaration	border-right-width border-style border-color
border-right-color	Définir la couleur de la bordure de droite	border-color
border-right-style	Définir le style de la bordure de droite	border-style
border-right-width	Définir la largeur de la bordure de droite	thin medium thick length
border-style	Définir le style des bordures. Peut être de 1 à 4 styles différents.	none hidden dotted dashed solid double groove ridge inset outset
border-top	Permet de mettre toutes les propriétés de la bordure du dessus en une déclaration	border-top-width border-style border-color
border-top-color	Définir la couleur de la bordure du dessus	border-color
border-top-style	Définir le style de la bordure du dessus	border-style
border-top-width	Définir la largeur de la bordure du dessus	thin medium thick length
border-width	Permet de mettre toutes les propriétés de la largeur des bordures en une déclaration. Peut être de 1 à 4 largeurs différents	thin medium thick length

 

CSS Marge (margin)