border |
Bordure |
---|---|
CSS |
Syntaxe
border: paramètres; |
Paramètres
Paramètre | Description | |||||
---|---|---|---|---|---|---|
border-color | Ce paramètre de propriété permet d'indiquer la couleur : | |||||
Valeur | R | V | B | Description | ||
aliceblue | F0 | F8 | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu d'Alice | ||
antiquewhite | FA | EB | D7 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le blanc antique | ||
aqua | 00 | FF | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'aqua | ||
aquamarine | 7F | FF | D4 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'aquamarine | ||
azure | F0 | FF | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'azure | ||
beige | F5 | F5 | DC | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le beigne | ||
bisque | FF | E4 | C4 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bisque | ||
black | 00 | 00 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le noir | ||
blanchedalmond | FF | EB | CD | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le blanc d'Almond | ||
blue | 00 | 00 | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu | ||
blueviolet | 8A | 2B | E2 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu violet | ||
brown | A5 | 2A | 2A | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le brun | ||
burlywood | DE | B8 | 87 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le «Burlywood» | ||
cadetblue | 5F | 9E | A0 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu cadet | ||
chartreuse | 7F | FF | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est la chartreuse | ||
chocolate | D2 | 69 | 1E | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le chocolat | ||
coral | FF | 7F | 50 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est la coral | ||
cornflowerblue | 64 | 95 | ED | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu fleur de maïs | ||
cornsilk | FF | F8 | DC | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le soie de maïs | ||
crimson | DC | 14 | 3C | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le «crimson» | ||
cyan | 00 | FF | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le cyan | ||
darkblue | 00 | 00 | 8B | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu foncé | ||
darkcyan | 00 | 8B | 8B | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le cyan foncé | ||
darkgoldenrod | B8 | 86 | 0B | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le Rod d'or foncé | ||
darkgray | A9 | A9 | A9 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris foncé | ||
darkgrey | A9 | A9 | A9 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris foncé | ||
darkgreen | 00 | 64 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert foncé | ||
darkkhaki | BD | B7 | 6B | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le Khaki foncé | ||
darkmagenta | 8B | 00 | 8B | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le magenta foncé | ||
darkolivegreen | 55 | 6B | 2F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'olive verte foncé | ||
darkorange | FF | 8C | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'orange foncé | ||
darkorchid | 99 | 32 | CC | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'orchidée foncée | ||
darkred | 8B | 00 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rouge foncé | ||
darksalmon | E9 | 96 | 7A | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le saumon foncé | ||
darkseagreen | 8F | BC | 8F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert océan foncé | ||
darkslateblue | 48 | 3D | 8B | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'ardoise bleu foncé | ||
darkslategray | 2F | 4F | 4F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'ardoise gris foncé | ||
darkslategrey | 2F | 4F | 4F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'ardoise gris foncé | ||
darkturquoise | 00 | CE | D1 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le turquoise foncé | ||
darkviolet | 94 | 00 | D3 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le violet foncé | ||
deeppink | FF | 14 | 93 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rose foncé | ||
deepskyblue | 00 | BF | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu profond ciel | ||
dimgray | 69 | 69 | 69 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le faible gris | ||
dimgrey | 69 | 69 | 69 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le faible gris | ||
dodgerblue | 1E | 90 | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu embusqué | ||
firebrick | B2 | 22 | 22 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu embusqué | ||
floralwhite | FF | FA | F0 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le blanc floral | ||
forestgreen | 22 | 8B | 22 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert forêt | ||
fuchsia | FF | 00 | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le magenta | ||
gainsboro | DC | DC | DC | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le Gainsboro | ||
ghostwhite | F8 | F8 | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le blanc fantôme | ||
gold | FF | D7 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est Or | ||
goldenrod | DA | A5 | 20 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est Rod doré | ||
gray | 80 | 80 | 80 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris | ||
grey | 80 | 80 | 80 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris | ||
green | 00 | 80 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert | ||
greenyellow | AD | FF | 2F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert/jaune | ||
honeydew | F0 | FF | F0 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est la rosé de miel | ||
hotpink | FF | 69 | B4 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est la rose chaud | ||
indianred | CD | 5C | 5C | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rouge amérindien | ||
indigo | 4B | 00 | 82 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'indigo | ||
ivory | FF | FF | F0 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'Ivory | ||
khaki | F0 | E6 | 8C | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le Khaki | ||
lavender | E6 | E6 | FA | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le lavande | ||
lavenderblush | FF | F0 | F5 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le lavande rougissent | ||
lawngreen | 7C | FC | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert pelouse | ||
lemonchiffon | FF | FA | CD | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le mousseline de soie de citron | ||
lightblue | AD | D8 | E6 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu claire | ||
lightcoral | F0 | 80 | 80 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le choral claire | ||
lightcyan | E0 | FF | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le cyan claire | ||
lightgoldenrodyellow | FA | FA | D2 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le jaune d'Or léger de Rod | ||
lightgray | D3 | D3 | D3 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris claire | ||
lightgrey | D3 | D3 | D3 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris claire | ||
lightgreen | 90 | EE | 90 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert claire | ||
lightpink | FF | B6 | C1 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rose claire | ||
lightsalmon | FF | A0 | 7A | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le saumon claire | ||
lightseagreen | 20 | B2 | AA | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert océan claire | ||
lightskyblue | 87 | CE | FA | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu ciel claire | ||
lightslategray | 77 | 88 | 99 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris léger d'Ardoise | ||
lightslategrey | 77 | 88 | 99 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris léger d'Ardoise | ||
lightsteelblue | B0 | C4 | DE | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu acier léger | ||
lightyellow | FF | FF | E0 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le jaune claire | ||
lime | 00 | FF | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert claire (lime) | ||
limegreen | 32 | CD | 32 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le chaux vert. | ||
linen | FA | F0 | E6 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est toile. | ||
magenta | FF | 00 | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le magenta | ||
maroon | 80 | 00 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le brun/maron | ||
mediumaquamarine | 66 | CD | AA | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le cyan médium marin | ||
mediumblue | 00 | 00 | CD | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu médium | ||
mediumorchid | BA | 55 | D3 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'orchidée moyenne | ||
mediumpurple | 93 | 70 | D8 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le pourpre moyen | ||
mediumseagreen | 3C | B3 | 71 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert océan moyen | ||
mediumslateblue | 7B | 68 | EE | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu moyen d'Ardoise | ||
mediumspringgreen | 00 | FA | 9A | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert moyen | ||
mediumturquoise | 48 | D1 | CC | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le turquoise moyen | ||
mediumvioletred | C7 | 15 | 85 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rouge violet moyen | ||
midnightblue | 19 | 19 | 70 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu de minuit | ||
mintcream | F5 | FF | FA | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le crème de monnayage | ||
mistyrose | FF | E4 | E1 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rose brumeuse | ||
moccasin | FF | E4 | B5 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le moccasin | ||
navajowhite | FF | DE | AD | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le blanc de Navajo | ||
navy | 00 | 00 | 80 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu marin (navy) | ||
oldlace | FD | F5 | E6 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est du «vieux lacet» | ||
olive | 80 | 80 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'olive | ||
olivedrab | 6B | 8E | 23 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'olive terne | ||
orange | FF | A5 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'orange | ||
orangered | FF | 45 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'orange rouge | ||
orchid | DA | 70 | D6 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est l'orchidée | ||
palegoldenrod | EE | E8 | AA | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le Rod d'Or pâle | ||
palegreen | 98 | FB | 98 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert pâle | ||
paleturquoise | AF | EE | EE | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le turquoise pâle | ||
palevioletred | D8 | 70 | 93 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le violet rouge | ||
papayawhip | FF | EF | D5 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le fouet de Papaye | ||
peachpuff | FF | DA | B9 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le souffle de pêche | ||
peru | CD | 85 | 3F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est de Pérou | ||
pink | FF | C0 | CB | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rose | ||
plum | DD | A0 | DD | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le prune | ||
powderblue | B0 | E0 | E6 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu de poudre | ||
purple | 80 | 00 | 80 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le pourpre | ||
red | FF | 00 | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le rouge | ||
rosybrown | BC | 8F | 8F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le brun attrayant | ||
royalblue | 41 | 69 | E1 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu royal | ||
saddlebrown | 8B | 45 | 13 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le brun de selle | ||
salmon | FA | 80 | 72 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le saumon | ||
sandybrown | F4 | A4 | 60 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le brun arénacé | ||
seagreen | 2E | 8B | 57 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert océan | ||
seashell | FF | F5 | EE | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le coquillage d'océan | ||
sienna | A0 | 52 | 2D | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le Sienne | ||
silver | C0 | C0 | C0 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris claire (sliver) | ||
skyblue | 87 | CE | EB | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu ciel. | ||
slateblue | 6A | 5A | CD | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu d'Ardoise. | ||
slategray | 70 | 80 | 90 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris d'Ardoise. | ||
slategrey | 70 | 80 | 90 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le gris d'Ardoise. | ||
snow | FF | FA | FA | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est neige. | ||
springgreen | 00 | FF | 7F | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert fluo. | ||
steelblue | 46 | 82 | B4 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le bleu acier. | ||
tan | D2 | B4 | 8C | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est bronzage. | ||
teal | 00 | 80 | 80 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le vert/bleu foncé (teal) | ||
thistle | D8 | BF | D8 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est charbon | ||
tomato | FF | 63 | 47 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est tomate | ||
turquoise | 40 | E0 | D0 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est turquoise | ||
violet | EE | 82 | EE | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le violet | ||
violet | EE | 82 | EE | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le violet | ||
wheat | F5 | DE | B3 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est comme le blé | ||
white | FF | FF | FF | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le blanc | ||
whitesmoke | F5 | F5 | F5 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le blanc fumeur | ||
yellow | FF | FF | 00 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le jaune | ||
yellowgreen | 9A | CD | 32 | Cet attribut permet d'indiquer que la couleur d'affichage du traçage est le jaune/vert | ||
rgb(r,g,b) | Cette fonction permet d'indiquer la couleur en format RVB (Rouge-Vert-Bleu), chacune des trois valeurs décimal sont limités dans l'intervalle de 0 à 255 ou de 0% à 100%. | |||||
#rrggbb | Cette fonction permet d'indiquer la couleur en format RVB (Rouge-Vert-Bleu), chacune des trois valeurs hexadécimal sont limités dans l'intervalle de 00 à FF et ont toujours deux chiffres. | |||||
transparent | Cet attribut permet d'indiquer que la couleur est transparente. Valeur par défaut. | |||||
border-style | Ce paramètre de propriété permet d'indiquer la variante : | |||||
Valeur | Aperçu | Description | ||||
none | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer qu'il n'y a pas de bordure. | ||||
dashed | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer que la bordure est de style de ligne pointillé. | ||||
dotted | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer que la bordure est de style de point pointillé. | ||||
double | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer une double bordure. | ||||
groove | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer que la bordure est de style ombré vers le bas. | ||||
hidden | Cet attribut permet d'indiquer qu'il n'y a pas de bordure à l'exception de conflit avec des éléments d'un tableau. | |||||
inset | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer que la bordure est de style ombré intérieur. | ||||
outset | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer que la bordure est de style ombré extérieur. | ||||
ridge | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer que la bordure est de style ombré vers le haut. | ||||
solid | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer que la bordure est une seule et même couleur sans aucun motif (solide). | ||||
border-width | Ce paramètre de propriété permet d'indiquer la largeur de la bordure : | |||||
Valeur | Aperçu | Description | ||||
thin | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer une bordure de largeur fine. | ||||
medium | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer une bordure de largeur moyenne. | ||||
thick | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer une bordure de largeur grasse. | ||||
largeur | Ceci est un texte d'exemple |
Cet attribut permet d'indiquer une bordure de largeur du nombre de pixels spécifié. |
Description
Cette propriété permet de définir le format de la bordure d'un élément comme un tableau par exemple.
Remarques
- Voici les spécifications recommandé par le «w3c» en 17 couleurs :
- Définir une bordure complète avec la propriété border : La propriété border permet de définir en une seule ligne la largeur, le style et la couleur d'une bordure. Cela simplifie le code et améliore la lisibilité, surtout lorsque vous utilisez des styles simples comme border: 1px solid black;. Cependant, si vous souhaitez personnaliser chaque côté de l'élément, il peut être préférable d'utiliser des propriétés spécifiques comme border-top ou border-left.
- Compatibilité des styles de bordure : La propriété border prend en charge plusieurs styles comme solid, dashed, et dotted, mais leur rendu peut varier d'un navigateur à l'autre. Par exemple, certains navigateurs affichent des bordures dotted comme des lignes continues lorsqu'elles sont trop petites. Testez vos designs sur plusieurs navigateurs et appareils pour garantir un rendu uniforme.
- Effet de bordure sur les dimensions de l'élément : Une bordure ajoutée à un élément augmente sa taille globale par défaut, car elle est incluse dans le modèle de boîte classique. Pour éviter cela, utilisez box-sizing: border-box;, incluant les bordures dans les dimensions spécifiées en width et height. Cela simplifie la gestion des mises en page réactives et prévient les débordements inattendus.
- Personnalisation avancée avec des bordures différentes sur chaque côté : Avec des propriétés comme border-top, border-right, border-bottom, et border-left, vous pouvez définir des bordures différentes pour chaque côté d'un élément. Cela permet de créer des effets visuels uniques, comme une bordure supérieure épaisse et des bordures latérales fines. Assurez-vous d'utiliser une approche cohérente pour éviter de surcharger l'esthétique de votre design.
- Utilisation des couleurs transparentes pour des bordures élégantes : En utilisant des couleurs transparentes avec rgba() ou hsla(), vous pouvez créer des bordures légères s'intégrant harmonieusement avec les arrière-plans. Cela est particulièrement utile pour des designs modernes et minimalistes où des bordures trop contrastées pourraient détourner l'attention. Cependant, testez toujours vos couleurs pour garantir une bonne lisibilité dans différents environnements.
- Effets interactifs avec les bordures dynamiques : Vous pouvez modifier les bordures d'un élément en fonction des interactions utilisateur, comme le survol (:hover) ou le focus (:focus). Par exemple, augmenter la largeur d'une bordure ou changer sa couleur peut indiquer à l'utilisateur que l'élément est interactif. Faites attention à la performance et à la fluidité de ces effets, surtout lorsqu'ils sont combinés avec des animations CSS.
- Effets complexes avec des bordures doubles ou imbriquées : La propriété border-style supporte des styles comme double, pouvant créer un effet visuel sophistiqué. Cependant, pour des designs plus complexes, il est souvent préférable de combiner des bordures avec d'autres éléments imbriqués ou des pseudo-éléments (::before, ::after). Cela donne un contrôle plus précis et permet d'appliquer des effets plus avancés.
- Alternative aux bordures avec des ombres et des dégradés : Pour des designs plus modernes, vous pouvez parfois remplacer ou compléter les bordures avec des ombres (box-shadow) ou des dégradés (background-image). Cela permet de créer des bordures semblant flotter ou se fondre dans leur environnement. Cependant, n'oubliez pas de tester ces approches pour assurer leur compatibilité et leur performance sur tous les navigateurs Web.
| ||||||||||
| ||||||||||
|
Dernière mise à jour : Dimanche, le 20 décembre 2015