border-style
IE 4,5,6,7 - CSS 1 Cette forme courte de propriété permet d'appliquer à plusieurs côtés d'une bordure le même style ou un style différent. Vous pouvez fournir de une à quatre valeurs de style de bordure séparées par un espace. Le nombre de valeurs spécifiées détermine à quels côtés de la bordure ce style doit être appliqué.
Pour la façon particulière dont Internet Explorer interprête parfois ces propriétés, reportez-vous à la propriété border.
Les valeurs de style sont
des constantes dont la liste est données ci-contre.
La façon précise dont les navigateurs interprètent les définitions des valeurs de style est loin d'être universelle. Le tableau suivant offre un récapitulatif des styles affichés dans Internet Explorer 6 pour Windows et Explorer 5 pour Macintosh. Les navigateurs plus récent supportent toutes les valeurs, mais ne vous attendez pas à une représentation identique dans tous les navigateurs.
| Valeur | IE/Windows | IE/Mac | CSS |
|---|---|---|---|
| dashed | 5.5 | 4 | 1 |
| dotted | 5.5 | 4 | 1 |
| double | 4 | 4 | 1 |
| groove | 4 | 4 | 1 |
| hidden | 7 | 4 | 2 |
| inset | 4 | 4 | 1 |
| none | 4 | 4 | 1 |
| outset | 4 | 4 | 1 |
| ridge | 4 | 4 | 1 |
| solid | 4 | 4 | 1 |
| Nombre de valeurs | Effet |
|---|---|
| 1 | La valeur spécifiée est appliquée aux quatre côtés de la bordure. |
| 2 | La première valeur spécifiée est appliquée aux côtés supérieur et inférieur, et la seconde valeur aux côtés droit et gauche |
| 3 | La première valeur est appliquée au côté supérieur, la seconde aux côtés droit et gauche, et la troisième au côté inférieur |
| 4 | Chaque valeur est appliquée, respectivement, au côté supérieur, droit, inférieur et gauche |
none
div {border-style: solid double; border-width: 4px}
Tous les éléments, mais uniquement les éléments de niveau bloc et éléments remplacés (IMG, INPUT, TEXTAREA, SELECT et OBJECT) dans IE 4 et 5 pour Windows.
[window.]document .getElementById("elementID") .style .borderStyle
Exemple
border-bottom-color,
border-top-color,
border-left-color,
border-right-color
(pour définir la couleur d'un seul bord d'un cadre)
border-bottom-style,
border-top-style,
border-left-style,
border-right-style
(pour définir le style d'un seul bord d'un cadre)
border-bottom-width,
border-top-width,
border-left-width,
border-right-width
(pour définir l'épaisseur d'un seul bord d'un cadre)
border-bottom,
border-top,
border-left,
border-right,
(pour définir toutes les caractéristiques d'un seul bord d'un cadre)
border-color
(pour définir la couleur d'un cadre)
border-style
(pour définir le style d'un cadre)
border-width
(pour définir l'épaisseur d'un cadre)
border
(pour définir toutes les caractéristiques d'un cadre).
-moz-border-radius, -moz-border-radius-bottomleft,
-moz-border-radius-bottomright,
-moz-border-radius-topleft,
-moz-border-radius-topright
(propriétés propres à Mozilla pour définir les formes d'angle d'un cadre).
Ce site vous a plu ? Visitez aussi :
et
Cette page est inspirée d'un texte anglophone extrait du livre HTML - Definitive Reference.
L'adaptation de ce texte a été réalisée par css-faciles.
Son contenu peut être recopié sous la condition express de faire figurer la présente mention
(y compris les 2 liens ci-dessus) dans le contenu copié.
Pour plus de détail sur ce copyright,
consultez notre page consacrée aux droits de copie.
Introduction
Premiers pas
Héritages
Eléments "blocs"
Mise en page
Problèmes
Des tableaux
Pseudo-frames
Menu déroulant
Styles alternatifs
10 trucs à savoir
Couleurs CSS
Unités CSS
Classement alphabétique
Classement par familles
Réflexions et prises de tête
Les fausses promesses
Tableaux contre CSS : le combat
Les ayatollahs
Recherche
Haut de page
Page précédente
Page suivante
