TOP > Back > Place > Next

左右属性解説   

◆ 左右の文字レイアウトを実現する属性

「左右」を指定する属性を持ったものがいくつかあります。これを利用することで、要素の内容を左右寄せ、または中央揃えにすることができます。

文字列(テキスト)等をスタイルシートのプロパティで指定するには、
STYLE="TEXT-ALIGN:左中右値;"で変更できます。
他のものに、左右を指定するプロパティもあります。
例えば、画像やテーブル(表)等の FLOAT:左右値; を使います。(其々の要素で説明)


ソース:(初期値です)
<H3>見出しです</H3>
表示結果:(属性指定をしていなければ必ず左揃え)

指定なしは、常に左寄せ


ソース:
<DIV STYLE="TEXT-ALIGN: LEFT">
<H3>左揃え</H3>
<P>これが、左に寄せた文字の配置で、<BR>DIVのスタイル指定が終われば・・・</P>
</DIV>
元に戻ります。

表示結果:

左揃え

これが、左に寄せた文字の配置で、
DIVのスタイル指定が終われば・・・

元に戻ります。

ソース:
<DIV STYLE="TEXT-ALIGN: CENTER">
<H3>中央揃え</H3>
<P>これが、右に寄せた文字の配置で、<BR>DIVのスタイル指定が終われば・・・</P>
</DIV>
元に戻ります。

表示結果:

中央揃え

これが、中央にした文字の配置で、
DIVのスタイル指定が終われば・・・

元に戻ります。

ソース:
<DIV STYLE="TEXT-ALIGN: RIGHT">
<H3>右揃え</H3>
<P>これが、右に寄せた文字の配置で、<BR>DIVのスタイル指定が終われば・・・</P>
</DIV>
元に戻ります。

表示結果:

右揃え

これが、右に寄せた文字の配置で、
DIVのスタイル指定が終われば・・・

元に戻ります。

文字の寄せ(揃え)は、STYLE="TEXT-ALIGN: に LEFT/CENTER/RIGHT"と指定することで、要素(コンテナ)の中身を左寄せ/中央揃え/右寄せにすることができます。Webブラウザの幅を変えても、ALIGN属性で指定された表示位置は変わりません。

その他のスタイルシートへの左右変更は、それぞれの要素で解説しています。


 【←BACKNEXT→
Copyright (c) Producer by System KS. 2001 All rights reserved.