画面例1
aaaaa
bbbbbbbbbbbbbbb
cccccccccc
ddddd
| m1 | m2 | m3 |
| d1100 | d1200 | d1300 |
| d2100 | d2200 | d2300 |
|
|
左のような画面を作りました。
ちょっとカッコ悪いと思いませんか?
文字と表がバラバラで、まとまりがありません。
bbbbbbbbbbbbbbb〜dddddを表に合わせてスッキリさせたいですネ!
コーディング
<html>
<body>
<center>aaaaa</center>
<br>
<font color="red">
bbbbbbbbbbbbbbb<br>
cccccccccc<br>
ddddd<br>
</font>
<center>
<table border>
<tr><th>m1
</th><th>m2
</th><th>m3
</th></tr>
<tr><td>d1100
</td><td>d1200
</td><td>d1300
</td></tr>
<tr><td>d2100
</td><td>d2200
</td><td>d2300
</td></tr>
</table>
</center>
</body>
</html>
|
|
|
画面例2
aaaaa
bbbbbbbbbbbbbbb
cccccccccc
ddddd
| m1 | m2 | m3 |
| d1100 | d1200 | d1300 |
| d2100 | d2200 | d2300 |
|
|
|
表の左側に揃えました。(よしよし)
コーディング
<html>
<body>
<center>aaaaa</center>
<br>
<center>
<table><tr><td>‥‥‥@
<font color="red">
bbbbbbbbbbbbbbb<br>
cccccccccc<br>
ddddd<br>
</font>
<table border>
<tr><th>m1
</th><th>m2
</th><th>m3
</th></tr>
<tr><td>d1100
</td><td>d1200
</td><td>d1300
</td></tr>
<tr><td>d2100
</td><td>d2200
</td><td>d2300
</td></tr>
</table>
</td></tr></table>‥‥‥@'
</center>
</body>
</html>
|
|
|
画面例2の説明
aaaaa
bbbbbbbbbbbbbbb
cccccccccc
ddddd
| m1 | m2 | m3 |
| d1100 | d1200 | d1300 |
| d2100 | d2200 | d2300 |
|
|
|
|
文字と表を
@〜@'
のTABLEで囲んで、TABLE全体をセンタリングしています。
左図の赤の囲みがテーブルなのですが、
@〜@'のようにコーディングすると表示されません。
文字の部分が表や画像でも応用できました。
表示をスッキリさせたいとき、結構役に立つかも.....?
|