Maison > interface Web > tutoriel CSS > le corps du texte

Comment utiliser la propriété CSS border-spacing

不言
Libérer: 2018-11-29 09:23:13
original
3229 Les gens l'ont consulté

L'attribut border-spacing est utilisé pour spécifier la bordure des cellules adjacentes et l'espacement entre les bordures. L'attribut border-spacing n'est efficace que lorsque la valeur de l'attribut border-collapse est séparée. Cet article vous présentera l'utilisation de l'attribut CSS border-spacing. Jetons un coup d'œil au contenu spécifique.

Comment utiliser la propriété CSS border-spacing

Jetons d'abord un coup d'œil à Qu'est-ce que l'attribut border-spacing en CSS ?

La propriété border-spacing spécifie l'espacement entre les bords des cellules adjacentes de la bordure du tableau.

Cependant, cela ne fonctionne que lorsque séparé est spécifié à l'aide de border-collapse.

Regardons un exemple spécifique

Code HTML

<div class="demo">
<table>
<tr>
<td>文字内容</td>
<td>文字内容</td>
</tr>
<tr>
<td>文字内容</td>
<td>文字内容</td>
</tr>
</table>
</div>
Copier après la connexion

Code CSS

.demo table {
  border: 2px solid #0000000;
  border-collapse: separate;
  border-spacing: 15px;
}
.demo table td {
  border: 2px solid #d49fc2;
}
Copier après la connexion

Le L'effet d'affichage sur le navigateur est le suivant : l'espacement entre les cellules apparaît.

Comment utiliser la propriété CSS border-spacing

Si vous modifiez la valeur de l'attribut border-spacing à 50px, l'effet affiché sur le navigateur est le suivant et l'espace entre les cellules adjacentes deviendra plus grand.

Comment utiliser la propriété CSS border-spacing

Cet article se termine ici Pour un contenu plus passionnant sur CSS, vous pouvez consulter la Vidéo CSS sur le didacticiel du site Web chinois phpApprendre. plus loin! ! !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!