ホームページ > 記事 > ウェブフロントエンド > html_html/css_WEB-ITnose でテーブルの表示を改善する方法
HTML ファイルの記述では、いくつかのテーブルを作成するために table がよく使用されます。より表のように表示するにはどうすればよいでしょうか?次に説明します。
基本フォーマット
<div> <th>我的一张表格</th> <table border="1"> <tr> <th>姓名</th> <th>年龄</th> <th>班级</th> </tr> <tr> <td>张山</td> <td>20</td> <td>计算机1班</td> </tr> </table></div>
表示効果は次のとおりです:
幅を広げるには、テーブルの width 属性を設定するだけです。セルを実線で区切る場合は、表のセルスペース = 0 を設定します。セル内のコンテンツとセルの境界線の間の距離を 0 にしたい場合は、テーブルの cellpadding=0 を設定し、各セルの高さを増やしたい場合は、各 < で height=40 属性を設定します。 td>タグ。
<div> <th>我的二张表格</th> <table border="1" cellspacing="0" cellpadding="0" width="400" > <tr> <th>姓名</th> <th>年龄</th> <th>班级</th> </tr> <tr> <td height="40">张山</td> <td >20</td> <td >计算机1班</td> </tr> </table> </div>
表示効果は次のとおりです:
テキストを中央に表示したい場合は、td の align 属性を設定できます。
<div> <th>我的三张表格</th> <table border="1" cellspacing="0" cellpadding="0" width="400"> <tr> <th>姓名</th> <th>年龄</th> <th>班级</th> </tr> <tr> <td align="center" height="40">张山</td> <td align="center">20</td> <td align="center">计算机1班</td> </tr> </table> </div>
表示効果は次のとおりです: