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-top-style/index.md | 198 ++++++----------------------- 1 file changed, 41 insertions(+), 157 deletions(-) (limited to 'files/fr/web/css/border-top-style') diff --git a/files/fr/web/css/border-top-style/index.md b/files/fr/web/css/border-top-style/index.md index e95aca2f87..4b04436042 100644 --- a/files/fr/web/css/border-top-style/index.md +++ b/files/fr/web/css/border-top-style/index.md @@ -1,15 +1,12 @@ --- title: border-top-style slug: Web/CSS/border-top-style -tags: - - CSS - - Propriété - - Reference translation_of: Web/CSS/border-top-style +browser-compat: css.properties.border-top-style --- {{CSSRef}} -La propriété** `border-top-style`** définit le style de ligne utilisé pour mettre en forme la bordure en haut d'une boîte. +La propriété **`border-top-style`** définit le style de ligne utilisé pour mettre en forme la bordure en haut d'une boîte. {{EmbedInteractiveExample("pages/css/border-top-style.html")}} @@ -32,146 +29,22 @@ border-top-style: outset; /* Valeurs globales */ border-top-style: inherit; -border-top-style: inherit; -border-top-style: inherit; +border-top-style: initial; +border-top-style: revert; +border-top-style: unset; ``` -### Valeurs - -- `` - - - : Un mot-clé décrivant la forme qu'on souhaite avoir pour la bordure du côté haut. 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-top-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-top-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-top-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-top-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. - -### Syntaxe formelle +La propriété `border-top-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). -{{csssyntax}} +## Définition formelle -## Exemples +{{CSSInfo}} -### CSS +## Syntaxe formelle -```css -/* On applique un style sur le tableau */ -table { - border-width: 2px; - background-color: #52E385; -} -tr, td { - padding: 3px; -} +{{csssyntax}} -/* Des exemples pour border-top-style */ -.b1 {border-top-style:none;} -.b2 {border-top-style:hidden;} -.b3 {border-top-style:dotted;} -.b4 {border-top-style:dashed;} -.b5 {border-top-style:solid;} -.b6 {border-top-style:double;} -.b7 {border-top-style:groove;} -.b8 {border-top-style:ridge;} -.b9 {border-top-style:inset;} -.b10 {border-top-style:outset;} -``` +## Exemples ### 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-top-style */ +.b1 {border-top-style: none;} +.b2 {border-top-style: hidden;} +.b3 {border-top-style: dotted;} +.b4 {border-top-style: dashed;} +.b5 {border-top-style: solid;} +.b6 {border-top-style: double;} +.b7 {border-top-style: groove;} +.b8 {border-top-style: ridge;} +.b9 {border-top-style: inset;} +.b10 {border-top-style: outset;} +``` + ### Résultat -{{EmbedLiveSample('Exemples', 300, 200)}} +{{EmbedLiveSample('', 300, 200)}} ## Spécifications -| Spécification | État | Commentaires | -| -------------------------------------------------------------------------------------------------------- | ---------------------------------------- | ---------------------------------- | -| {{SpecName('CSS3 Backgrounds', '#the-border-style', 'border-top-style')}} | {{Spec2('CSS3 Backgrounds')}} | Aucune modification significative. | -| {{SpecName('CSS2.1', 'box.html#border-style-properties', 'border-top-style')}} | {{Spec2('CSS2.1')}} | Définition initiale. | - -{{cssinfo}} +{{Specifications}} ## Compatibilité des navigateurs -{{Compat("css.properties.border-top-style")}} +{{Compat}} ## Voir aussi -- Les autres propriétés liées au style des bordures : - - - {{cssxref("border-left-style")}} - - {{cssxref("border-right-style")}} - - {{cssxref("border-bottom-style")}} - - {{cssxref("border-style")}}. - -- Les autres propriétés liées à la bordure haute : +- Les autres propriétés liées au style des bordures : [`border-left-style`](/fr/docs/Web/CSS/border-left-style), [`border-right-style`](/fr/docs/Web/CSS/border-right-style), [`border-bottom-style`](/fr/docs/Web/CSS/border-bottom-style), [`border-style`](/fr/docs/Web/CSS/border-style). - - {{cssxref("border-top")}} - - {{cssxref("border-top-color")}} - - {{cssxref("border-top-width")}}. +- Les autres propriétés liées à la bordure haute : [`border-top`](/fr/docs/Web/CSS/border-top), [`border-top-color`](/fr/docs/Web/CSS/border-top-color), [`border-top-width`](/fr/docs/Web/CSS/border-top-width). \ No newline at end of file -- cgit v1.2.3-54-g00ecf