サイト内検索

...スタイルシート(css)...

スタイルシート・table

セル内・左右の位置の指定

文字の左右の位置は、text-alignプロパティを指定します。
[使い方]
.sample{
text-align: left;
}
[左右方向の位置指定]
プロパティ名 説明
text-align: left左側に表示します。
center中央に表示します。
right右側に表示します。
justify両端に揃えます。
指定がない場合は、表の中央に表示されます。

セル内・上下の位置の指定

文字の上下の位置は、vertical-align:プロパティを指定します
[使い方]
.sample{
vertical-align: top;
}
[上下方向の位置指定]
プロパティ名 説明
vertical-align:baseline; 先頭行のベースラインに揃えます。
top;
または
text-top;
上部に文字を表示します。
middle;中央に表示します。
bottom;
または
text-bottom;
下部に表示します。

サンプル

[headの中]

<style type="text/css">
<!--
table{
border: 1px #999999 solid;
width: 80%;
height: 150px;
}
td, th{
border: 1px #999999 solid;
}
.sample1{
text-align: left;
vertical-align: top;
}
.sample2{
text-align: center;
vertical-align: middle;
}
.sample3{
text-align: ight;
vertical-align: bottom;
}
-->
</style>

[bodyの中]

<table>
<tr>
<td>指定なし</td>
<td id="sample1">left;・top;</td>
<th id="sample2">center;・middle; </td>
<td id="sample3">right;・bottom; </td>
</tr>
</table>

[ブラウザ上]

指定なしleft;・top;
center;・middle; right; ・bottom;

Copyright c 2007.10.01 luc All rights reserved.