Maison > Article > interface Web > css utilise table-layout : corrigé pour définir un exemple de code de largeur égale dans les cellules du tableau
css utilise table-layout : corrigé pour définir un exemple de code de largeur égale dans les cellules du tableau
- 黄舟original
- 2017-06-30 13:39:181752parcourir
Utilisez table-layout : fixe pour définir la même largeur de cellules du tableau. L'exemple est le suivant :
<!DOCTYPE>
<html><head><meta charset="utf-8" /><title>设置表格单元格等宽</title><style type="text/css">/*
使字体在所有设备上都达到最佳的显示
*/html {
-moz-osx-font-smoothing: grayscale;
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility; }/*
给body添加阴影
*/body:before {
content: "";
position: fixed;
top: -10px;
left: 0;
width: 100%;
height: 10px;
-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
box-shadow: 0px 0px 10px rgba(0,0,0,.8);
z-index: 100;}
/*
表格单元格等宽
*/
.calendar { table-layout: fixed; }</style></head><body>
<table width="100%" border="1" class="calendar">
<tr>
<td>我在测试我在测试我在测试我在测试我在测试我在测试我在测试我在测试我在测试</td>
<td>122222222222222</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>4</td>
<td>5</td>
</tr>
</table></body></html>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!
Déclaration：
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