From 8368b63869d1125e1f8bb18d627a3c8a873ecabf Mon Sep 17 00:00:00 2001 From: Carolyn Wu <87150472+cw118@users.noreply.github.com> Date: Sat, 1 Jan 2022 15:19:20 -0500 Subject: Small fixes and updates for fr CSS pages (#3476) * Fix markdown, macros, small updates pt. 1 * Fix missed xref macros in font-style * minor updates or typos Co-authored-by: julieng --- files/fr/web/css/border-right-style/index.md | 192 ++++++--------------------- 1 file changed, 38 insertions(+), 154 deletions(-) (limited to 'files/fr/web/css/border-right-style') diff --git a/files/fr/web/css/border-right-style/index.md b/files/fr/web/css/border-right-style/index.md index 14e3bb98ac..3111595661 100644 --- a/files/fr/web/css/border-right-style/index.md +++ b/files/fr/web/css/border-right-style/index.md @@ -1,15 +1,12 @@ --- title: border-right-style slug: Web/CSS/border-right-style -tags: - - CSS - - Propriété - - Reference translation_of: Web/CSS/border-right-style +browser-compat: css.properties.border-right-style --- {{CSSRef}} -La propriété** `border-right-style`** définit le style de ligne utilisé pour mettre en forme la bordure sur le côté droit d'une boîte. +La propriété **`border-right-style`** définit le style de ligne utilisé pour mettre en forme la bordure sur le côté droit d'une boîte. {{EmbedInteractiveExample("pages/css/border-right-style.html")}} @@ -33,114 +30,15 @@ border-right-style: outset; /* Valeurs globales */ border-right-style: inherit; border-right-style: initial; +border-right-style: revert; border-right-style: unset; ``` -### Valeurs - -- `` - - - : Un mot-clé décrivant la forme qu'on souhaite avoir pour la bordure du côté droit. Il peut prendre l'une des valeurs suivantes : - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
none - L'effet obtenu est le même qu'avec hidden : aucune bordure - n'est affichée. Dans ce cas, sauf si une image d'arrière-plan est - définie, la valeur calculée de - {{cssxref("border-right-width")}} sera 0, même - si cette dernière indique une autre valeur. Lorsqu'utilisée sur une - cellule d'un tableau avec la fusion des bordures, none a la - priorité la plus basse donc si une autre bordure est définie et fusionne - avec celle-ci, elle sera  affichée. -
hidden - L'effet obtenu est le même qu'avec none : aucune bordure - n'est affichée. Dans ce cas, sauf si une image d'arrière-plan est - définie, la valeur calculée de - {{cssxref("border-right-width")}} sera 0, même - si cette dernière indique une autre valeur. Lorsqu'utilisée sur une - cellule d'un tableau avec la fusion des bordures, hidden a - la plus haute priorité et donc si une autre bordure est définie et - fusionne avec celle-ci, aucune ne sera  affichée. -
dotted - Affiche une série de points ronds. L'espace entre ces points n'est pas - défini par la spécification et est donc laissé à l'implémentation. Le - rayon des points correspond à la moitié de - {{cssxref("border-right-width")}}. -
dashed - Affiche une série de tirets. La taille de ces tirets n'est pas définie - par la spécification et est laissée à l'implémentation. -
solidAffiche une ligne droite continue.
double - Deux lignes droites sont affichées dont la somme des épaisseurs - correspond à la valeur fournie par {{cssxref("border-width")}} - ou {{cssxref("border-right-width")}}. -
groove - La bordure crée un effet 3D donnant l'impression qu'elle a été gravée - dans le document. On obtient un effet opposé à ridge. -
ridge - La bordure crée un effet 3D donnant l'impression que la bordure ressort - du document. L'effet obtenu est opposé à celui obtenu avec - groove. -
inset - La bordure crée un effet 3D qui donne l'impression que la boîte est - renfoncée dans le document (l'effet obtenu est opposé à celui obtenu - avec outset). Lorsqu'elle est appliquée sur une cellule de - tableau et que {{cssxref("border-collapse")}} vaut - collapsed, cette valeur se comporte comme - groove. -
outset -

- La bordure crée un effet 3D qui fait ressortir la boîte (l'effet est - opposé à inset). Lorsqu'elle est utilisé sur une cellule - de tableau avec {{cssxref("border-collapse")}} qui vaut - collapsed, cette valeur se comporte comme - ridge. -

-
- -- `inherit` - - : Ce mot-clé représente le style de la bordure utilisé pour l'élément parent. +La propriété `border-right-style` se définit avec l'un des mots-clés utilisés par la propriété [`border-style`](/fr/docs/Web/CSS/border-style). + +## Définition formelle + +{{CSSInfo}} ### Syntaxe formelle @@ -148,31 +46,6 @@ border-right-style: unset; ## Exemples -### CSS - -```css -/* On applique un style sur le tableau */ -table { - border-width: 2px; - background-color: #52E385; -} -tr, td { - padding: 3px; -} - -/* Des exemples pour border-right-style */ -.b1 {border-right-style:none;} -.b2 {border-right-style:hidden;} -.b3 {border-right-style:dotted;} -.b4 {border-right-style:dashed;} -.b5 {border-right-style:solid;} -.b6 {border-right-style:double;} -.b7 {border-right-style:groove;} -.b8 {border-right-style:ridge;} -.b9 {border-right-style:inset;} -.b10 {border-right-style:outset;} -``` - ### HTML ```html @@ -196,34 +69,45 @@ tr, td { ``` +### CSS + +```css +/* On applique un style sur le tableau */ +table { + border-width: 2px; + background-color: #52E385; +} +tr, td { + padding: 3px; +} + +/* Des exemples pour border-right-style */ +.b1 {border-right-style: none;} +.b2 {border-right-style: hidden;} +.b3 {border-right-style: dotted;} +.b4 {border-right-style: dashed;} +.b5 {border-right-style: solid;} +.b6 {border-right-style: double;} +.b7 {border-right-style: groove;} +.b8 {border-right-style: ridge;} +.b9 {border-right-style: inset;} +.b10 {border-right-style: outset;} +``` + ### Résultat -{{EmbedLiveSample('Exemples', 300, 200)}} +{{EmbedLiveSample('')}} ## Spécifications -| Spécification | État | Commentaires | -| ------------------------------------------------------------------------------------------------------------ | ---------------------------------------- | ---------------------------------- | -| {{SpecName('CSS3 Backgrounds', '#the-border-style', 'border-right-style')}} | {{Spec2('CSS3 Backgrounds')}} | Aucune modification significative. | -| {{SpecName('CSS2.1', 'box.html#border-style-properties', 'border-right-style')}} | {{Spec2('CSS2.1')}} | Définition initiale. | - -{{cssinfo}} +{{Specifications}} ## Compatibilité des navigateurs -{{Compat("css.properties.border-right-style")}} +{{Compat}} ## Voir aussi -- Les autres propriétés liées au style des bordures : - - - {{cssxref("border-left-style")}} - - {{cssxref("border-top-style")}} - - {{cssxref("border-bottom-style")}} - - {{cssxref("border-style")}}. - -- Les autres propriétés liées à la bordure droite : +- Les autres propriétés liées au style des bordures : [`border-left-style`](/fr/docs/Web/CSS/border-left-style), [`border-top-style`](/fr/docs/Web/CSS/border-top-style), [`border-bottom-style`](/fr/docs/Web/CSS/border-bottom-style), [`border-style`](/fr/docs/Web/CSS/border-style). - - {{cssxref("border-right")}} - - {{cssxref("border-right-color")}} - - {{cssxref("border-right-width")}}. +- Les autres propriétés liées à la bordure droite : [`border-right`](/fr/docs/Web/CSS/border-right), [`border-right-color`](/fr/docs/Web/CSS/border-right-color), [`border-right-width`](/fr/docs/Web/CSS/border-right-width). -- cgit v1.2.3-54-g00ecf