配置

セル内の配置

tdやthで作られる項目の範囲をセルといいます。

セルの大きさを指定して広くとると文字の位置を指定したくなるかもしれません。

まずは指定しない時の様子(デフォルトといいます)を見てみます。thとtdで違います。

無指定の th 無指定の td

セル内の配置(横)

セル内での文字(画像)の位置を指定します。

左右の位置は text-align で指定し、値は left center right の3種類です。td または th または tr に指定します。

左(left) 中(center) 右(right)

残念ながらセルごとに class 分けして指定しなければなりません。tr を使って行ごとに指定することは可能ですが、列ごとに指定するブラウザの種類にかかわらずできる方法はありません。(ブラウザに依存する方法はあります)

td.wst{text-align:left;}
td.cen{text-align:center;}
td.est{text-align:right;}

セル内の配置(縦)

上下の位置は vertical-align で指定し、値は top middle bottom の3種類です。td または th または tr に指定します。

上(top) 中(middle) 下(bottom)

残念ながらセルごとに class 分けして指定しなければなりません。tr を使って行ごとに指定することは可能ですが、列ごとに指定するブラウザの種類にかかわらずできる方法はありません。(ブラウザに依存する方法はあります)

td.top{vertical-align:top;}
td.mid{vertical-align:middle;}
td.btm{vertical-align:bottom;}

聖愛中学高等学校
http://www.seiai.ed.jp/
Last Modified