テーブルレイアウト 05

タイトル
テキスト
タイトル

テキスト

テキスト

テキスト

テキスト

テキスト

テキスト
--- HTML ---
<table cellspacing="0" cellpadding="0" class="st1">
<tr>
<td class="title">タイトル</td>
</tr>
<tr>
<td>テキスト</td>
</tr>
<tr>
<td class="style">
	<table cellpadding="0" cellspacing="0">
	<tr>
	<td class="title" colspan="6">タイトル</td>
	</tr>
	<tr>
	<td><img src="img/pict.jpg" alt=""><p>テキスト</p></td>
	<td class="st2">テキスト</td>
	<td><img src="img/pict.jpg" alt=""><p>テキスト</p></td>
	<td class="st2">テキスト</td>
	<td><img src="img/pict.jpg" alt=""><p>テキスト</p></td>
	<td class="st2">テキスト</td>
	</tr>
	</table>
</td>
</tr>
</table>

--- CSS ---
table td {
 padding:5px;
 vertical-align:top;
}

.style {
 padding:0;
}

.style p {
 margin:0 5px;
}

.style td {
 font-size:85%;
 text-align:justify;
 text-justify:distribute;
}

.style img {
 margin:5px;
}

.st1 {
 width:595px;
 border:1px solid #999;
 font-size:80%;
 line-height:1.32em;
}

.st1 td.title {
color:#fff;
 background:#999;
 font-size:100%;
}

.st2 {
 width:73px;
 padding:7px 0;
}