意外とその都度考えてしまい、作業をストップしてしまうので、自分まとめ
まず、
tableのHTMLは
<table class="tbl_sample_0"> <tr> <th>テキスト</th> <td>テキスト</td> </tr> <tr> <th>テキスト</th> <td>テキスト</td> </tr> </table>
例1:こういうのやる場合
| テキスト | テキスト |
|---|---|
| テキスト | テキスト |
スタイルシートは
table.tbl_sample_01 {
border-collapse:collapse;
margin: 0px 50px;
width:400px;
}
.tbl_sample_01 th {
border:1px solid #CFCFCF;
width: 100px;
background-color: #FFFF99;
padding: 3px;
vertical-align: middle;
text-align:left;
}
.tbl_sample_01 td {
border:1px solid #CFCFCF;
background-color: #ffffff;
padding: 3px;
vertical-align: top;
}
例2:こういうのやる場合
| テキスト | テキスト |
|---|---|
| テキスト | テキスト |
スタイルシートは
table.tbl_sample_01 {
border:1px solid #BDA76A;
border-collapse:collapse;
clear:both;
margin: 0px 50px;
width:400px;
}
.tbl_sample_01 th {
background-color:#FAF4ED;
border-color:#BDA76A;
border-style:solid dashed solid solid;
border-width:1px;
font-weight:bold;
padding: 3px;
}
.tbl_sample_01 td {
border-color:#BDA76A;
border-style:solid none;
border-width:1px;
line-height:1.7em;
padding: 3px;
}
コメント投稿
トラックバック
トラックバックURL













