TRとTDに対するCSS設定方法を教えてください

質問

http://k52.org/syokuzai/c/fish/
↑のようなカレンダーを作りたいと考えております。

ソースよりTABLE内のTRとTDに外部CSSファイルで設定していると
思っているのですが、どのようにすればTDの背景色（紺色）より
大きい幅のTR（要は列）のライン（薄い青色）を付けられるのか
が分かりません。

わかりにくい説明とは思うのですが、どうぞよろしくお願いします。

回答No.1

yambejp · ベストアンサー

構造も簡単だしざっとみれば、ある程度想像つくと思いますが・・・

適合するCSSをぬきだすとこんな感じ

<style>
table.cal, tr, td {
padding:4px;
}
tr.fish {
background-color:#F3F6FF;
}
td.mon span {
background-color:#557766;
color:#FFFFFF;
display:block;
}
</style>

<table class="cal">
<tbody>
<tr class="fish">
<td class="mon"><span>1</span></td>
<td class="mon">2</td>
<td class="mon">3</td>
</tr>
<tr>
<td class="mon">4</td>
<td class="mon"><span>5</span></td>
<td class="mon">6</td>
</tr>
<tr class="fish">
<td class="mon">7</td>
<td class="mon">8</td>
<td class="mon"><span>9</span></td>
</tr>
</tbody>
</table>

お礼

早いご回答ありがとうございました。参考に色々してみます。