From 258ba7b4be62d8640477a3bd3146d08b00cb70ec Mon Sep 17 00:00:00 2001 From: julieng Date: Fri, 17 Sep 2021 20:59:20 +0200 Subject: convert content to md --- files/fr/web/css/border-inline-end/index.md | 140 ++++++++++++---------------- 1 file changed, 62 insertions(+), 78 deletions(-) (limited to 'files/fr/web/css/border-inline-end') diff --git a/files/fr/web/css/border-inline-end/index.md b/files/fr/web/css/border-inline-end/index.md index 860957487a..46b6334f11 100644 --- a/files/fr/web/css/border-inline-end/index.md +++ b/files/fr/web/css/border-inline-end/index.md @@ -8,51 +8,49 @@ tags: - Reference translation_of: Web/CSS/border-inline-end --- -
{{CSSRef}}{{SeeCompatTable}}
+{{CSSRef}}{{SeeCompatTable}} -

La propriété border-inline-end est une propriété raccourcie qui permet de définir la bordure d'un élément pour le côté correspondant à la fin de l'élément dans le sens de lecture. Elle peut être utilisée pour définir les valeurs de {{cssxref("border-inline-end-width")}}, {{cssxref("border-inline-end-style")}} et {{cssxref("border-inline-end-color")}}.

+La propriété **`border-inline-end`** est une propriété raccourcie qui permet de définir la bordure d'un élément pour le côté correspondant à la fin de l'élément dans le sens de lecture. Elle peut être utilisée pour définir les valeurs de {{cssxref("border-inline-end-width")}}, {{cssxref("border-inline-end-style")}} et {{cssxref("border-inline-end-color")}}. -
{{EmbedInteractiveExample("pages/css/border-inline-end.html")}}
+{{EmbedInteractiveExample("pages/css/border-inline-end.html")}} -

Cette propriété logique correspond à l'une des propriété physique équivalente selon le mode d'écriture, la directionnalité et l'orientation du texte. Autrement dit, elle correspond à l'une des propriétés {{cssxref("border-top")}}, {{cssxref("border-right")}}, {{cssxref("border-bottom")}} ou {{cssxref("border-left")}} selon les valeurs utilisées pour {{cssxref("writing-mode")}}, {{cssxref("direction")}} et {{cssxref("text-orientation")}}.

+Cette propriété logique correspond à l'une des propriété physique équivalente selon le mode d'écriture, la directionnalité et l'orientation du texte. Autrement dit, elle correspond à l'une des propriétés {{cssxref("border-top")}}, {{cssxref("border-right")}}, {{cssxref("border-bottom")}} ou {{cssxref("border-left")}} selon les valeurs utilisées pour {{cssxref("writing-mode")}}, {{cssxref("direction")}} et {{cssxref("text-orientation")}}. -

On peut rapprocher cette propriété des autres propriétés logiques raccourcies définissant les bordures des autres côtés :

+On peut rapprocher cette propriété des autres propriétés logiques raccourcies définissant les bordures des autres côtés : - +- {{cssxref("border-block-start")}}, +- {{cssxref("border-block-end")}}, +- {{cssxref("border-inline-start")}}. -

Syntaxe

+## Syntaxe -
border-inline-end: 1px;
+```css
+border-inline-end: 1px;
 border-inline-end: 2px dotted;
 border-inline-end: medium dashed green;
-
+``` -

Valeurs

+### Valeurs -

Une ou plusieurs valeurs parmi les suivantes, dans n'importe quel ordre :

+Une ou plusieurs valeurs parmi les suivantes, dans n'importe quel ordre : -
-
<'border-width'>
-
La largeur de la bordure pour ce côté, voir {{cssxref("border-width")}}.
-
<'border-style'>
-
Le style de la ligne utilisé pour la bordure de ce côté, voir {{cssxref("border-style")}}.
-
<'color'>
-
La couleur de la bordure sur ce côté, voir {{cssxref("color")}}.
-
+- `<'border-width'>` + - : La largeur de la bordure pour ce côté, voir {{cssxref("border-width")}}. +- `<'border-style'>` + - : Le style de la ligne utilisé pour la bordure de ce côté, voir {{cssxref("border-style")}}. +- `<'color'>` + - : La couleur de la bordure sur ce côté, voir {{cssxref("color")}}. -

Syntaxe formelle

+### Syntaxe formelle {{csssyntax}} -

Exemples

+## Exemples -

CSS

+### CSS -
div {
+```css
+div {
   background-color: yellow;
   width: 120px;
   height: 120px;
@@ -61,54 +59,40 @@ border-inline-end: medium dashed green;
 .exemple {
   writing-mode: vertical-rl;
   border-inline-end: 5px dashed blue;
-}
- -

HTML

- -
<div>
-  <p class="exemple">Texte d'exemple</p>
-</div>
-
- -

Résultat

- -

{{EmbedLiveSample("Exemples", 140, 140)}}

- -

Spécifications

- - - - - - - - - - - - - - - - -
SpécificationÉtatCommentaires
{{SpecName("CSS Logical Properties", "#propdef-border-inline-end", "border-inline-end")}}{{Spec2("CSS Logical Properties")}}Définition initiale.
- -

{{cssinfo}}

- -

Compatibilité des navigateurs

- -

{{Compat("css.properties.border-inline-end")}}

- -

Voir aussi

- - +} +``` + +### HTML + +```html +
+

Texte d'exemple

+
+``` + +### Résultat + +{{EmbedLiveSample("Exemples", 140, 140)}} + +## Spécifications + +| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------ | -------------------- | +| {{SpecName("CSS Logical Properties", "#propdef-border-inline-end", "border-inline-end")}} | {{Spec2("CSS Logical Properties")}} | Définition initiale. | + +{{cssinfo}} + +## Compatibilité des navigateurs + +{{Compat("css.properties.border-inline-end")}} + +## Voir aussi + +- Les propriétés physiques correspondantes : + + - {{cssxref("border-top")}}, + - {{cssxref("border-right")}}, + - {{cssxref("border-bottom")}}, + - {{cssxref("border-left")}} + +- {{cssxref("writing-mode")}}, {{cssxref("direction")}}, {{cssxref("text-orientation")}} -- cgit v1.2.3-54-g00ecf