Maison > interface Web > tutoriel CSS > css : l'attribut border-collapse résout le problème de bordure du tableau

css : l'attribut border-collapse résout le problème de bordure du tableau

黄舟
Libérer: 2017-06-30 09:31:41
original
1758 Les gens l'ont consulté

La bordure du tableau est la plus gênante dans la création de pages. Les tableaux avec des bordures étaient très ennuyeux à réaliser auparavant, mais aujourd'hui j'ai enfin résolu ce problème, je vais partager un exemple avec vous ci-dessous. L'un des plus gros problèmes dans la création de pages est la bordure du tableau. Je déteste créer des tableaux avec des bordures. Aujourd'hui, j'ai finalement résolu ce problème

border-collapseattribut. Très bonne solution au problème qui est enchevêtré depuis longtemps
CSS

Le code est le suivant :

.table{
border: 1px solid #ccc;
border-collapse: collapse; 
width:80%;}
.table th,
.table td{
border: 1px solid #ccc;
padding: 10px;
}
Copier après la connexion

Html

<table class="table"> 
<thead> 
<tr> 
<th>id</th> 
<th>作者</th> 
<th>书名</th> 
<th>内容</th> 
<th>分类</th> 
</tr> 
</thead> 
<tbody> 
<tr> 
<td>001</td> 
<td>唐家三少</td> 
<td>斗破苍穹</td> 
<td>斗破苍穹斗破苍穹</td> 
<td>玄幻</td> 
</tr> 
<tr class="success"> 
<td>001</td> 
<td>唐家三少</td> 
<td>斗破苍穹</td> 
<td>斗破苍穹斗破苍穹</td> 
<td>玄幻</td> 
</tr> 
</tbody> 
</table>
Copier après la connexion


PS : Utilisez la bordure -Image de comparaison avant et après l'attribut de réduction

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