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-spacing/index.md | 128 ++++++++++++++----------------- 1 file changed, 56 insertions(+), 72 deletions(-) (limited to 'files/fr/web/css/border-spacing') diff --git a/files/fr/web/css/border-spacing/index.md b/files/fr/web/css/border-spacing/index.md index f6e0d18643..20248d7b61 100644 --- a/files/fr/web/css/border-spacing/index.md +++ b/files/fr/web/css/border-spacing/index.md @@ -8,58 +8,54 @@ tags: - Tableaux CSS translation_of: Web/CSS/border-spacing --- -
{{CSSRef}}
+{{CSSRef}} -

La propriété border-spacing définit la distance qu'il y a entre les bordures de cellules adjacentes d'un tableau (uniquement lorsque {{cssxref("border-collapse")}} vaut separate). Cette propriété est équivalente à l'attribut HTML déprécié {{htmlattrxref("cellspacing","table")}} mais une deuxième valeur peut être utilisée afin d'obtenir un espacement vertical différent de l'espacement horizontal.

+La propriété **`border-spacing`** définit la distance qu'il y a entre les bordures de cellules adjacentes d'un tableau (uniquement lorsque {{cssxref("border-collapse")}} vaut `separate`). Cette propriété est équivalente à l'attribut HTML déprécié {{htmlattrxref("cellspacing","table")}} mais une deuxième valeur peut être utilisée afin d'obtenir un espacement vertical différent de l'espacement horizontal. -
{{EmbedInteractiveExample("pages/css/border-spacing.html")}}
+{{EmbedInteractiveExample("pages/css/border-spacing.html")}} -

La valeur de border-spacing est également utilisée le long du bord extérieur du tableau, où la distance entre la bordure du tableau et les cellules dans la première/dernière colonne ou ligne est la somme du border-spacing approprié (horizontal ou vertical) et du {{cssxref("padding")}} correspondant (top, right, bottom ou left).

+La valeur de `border-spacing` est également utilisée le long du bord extérieur du tableau, où la distance entre la bordure du tableau et les cellules dans la première/dernière colonne ou ligne est la somme du `border-spacing` approprié (horizontal ou vertical) et du {{cssxref("padding")}} correspondant (top, right, bottom ou left). -
-

Note : La propriété border-spacing équivaut à l'attribut déprécié cellspacing de l'élément <table>, sauf qu'il possède une seconde valeur optionnelle qui peut être utilisée pour définir différents espacements horizontaux et verticaux.

-
+> **Note :** La propriété `border-spacing` équivaut à l'attribut déprécié `cellspacing` de l'élément ``, sauf qu'il possède une seconde valeur optionnelle qui peut être utilisée pour définir différents espacements horizontaux et verticaux. -

Syntaxe

+## Syntaxe -
/* Une valeur de longueur */
-/* Type <length>         */
+```css
+/* Une valeur de longueur */
+/* Type          */
 border-spacing: 2px;
 
 /* La première valeur indique */
 /* l'espacement horizontal et */
-/* la seconde le vertical.    */
+/* la seconde le vertical.    */
 border-spacing: 1cm 2em;
 
 /* Valeurs globales */
 border-spacing: inherit;
 border-spacing: initial;
 border-spacing: unset;
-
+``` -

La propriété border-spacing peut être définie avec une ou deux valeurs :

+La propriété `border-spacing` peut être définie avec une ou deux valeurs : - +- Avec une valeur de type {{cssxref("<length>")}}, la valeur est utilisée pour l'espacement vertical ainsi que pour l'espacement horizontal. +- Avec deux valeurs de type {{cssxref("<length>")}}, la première définit l'espacement horizontal (entre les colonnes) et la seconde définit l'espacement vertical (entre les lignes). -

Valeurs

+### Valeurs -
-
length
-
Une valeur de longueur ({{cssxref("<length>")}} qui décrit l'espacement entre les cellules.
-
+- `length` + - : Une valeur de longueur ({{cssxref("<length>")}} qui décrit l'espacement entre les cellules. -

Syntaxe formelle

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

Exemples

+## Exemples -

CSS

+### CSS -
table {
+```css
+table {
   border-collapse: separate;
   border: 1px solid #000;
 }
@@ -75,59 +71,47 @@ td {
 
 .deuxvaleurs {
   border-spacing: 5px 10px;
-}
- -

HTML

- -
<table class="unevaleur">
-  <tr>
-    <td>Ces cellules</td>
-    <td>sont séparées par 5px</td>
-    <td>tout autour.</td>
-  </tr>
-</table>
-<br />
-<table class="deuxvaleurs">
-  <tr>
-    <td>Ces cellules</td>
-    <td>sont séparées par 5px d'écart horizontal</td>
-    <td>et 10px d'écart vertical.</td>
-  </tr>
-</table>
- -

Résultat

- -

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

- -

Spécifications

- -
- +} +``` + +### HTML + +```html +
- - - + + + - - +
SpécificationÉtatCommentairesCes cellulessont séparées par 5pxtout autour.
+
+ - - - + + + -
{{SpecName('CSS2.1', 'tables.html#separated-borders', 'border-spacing')}}{{Spec2('CSS2.1')}}Définition initiale.Ces cellulessont séparées par 5px d'écart horizontalet 10px d'écart vertical.
+``` + +### Résultat + +{{EmbedLiveSample("Exemples","300","300")}} + +## Spécifications + +| Spécification | État | Commentaires | +| ------------------------------------------------------------------------------------------------ | ------------------------ | -------------------- | +| {{SpecName('CSS2.1', 'tables.html#separated-borders', 'border-spacing')}} | {{Spec2('CSS2.1')}} | Définition initiale. | -

{{cssinfo}}

+{{cssinfo}} -

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("css.properties.border-spacing")}}

+{{Compat("css.properties.border-spacing")}} -

Voir auss

+## Voir auss - +- {{cssxref("border-collapse")}} +- {{cssxref("border-style")}} +- L'élément HTML {{htmlelement("table")}} -- cgit v1.2.3-54-g00ecf