text-align - 文字寄せを調整する
投稿日: / 更新日:
スタイルシートのtext-alignは、文字寄せの方向を指定するためのプロパティです。
サンプルコード
text-alignを指定したサンプルコードです。
div {
text-align: right ;
}デモ
text-alignにrightを指定して、テキストを右寄せにしたデモです。CSSを編集して、どのように表示が変わるか確認してみましょう。
値の指定
値の指定方法は主に下記の通りです。リンクをクリックするとデモを確認できます。
| 項目 | 説明 |
|---|---|
| inherit | 親要素の値を引き継ぐ。例の場合、div要素のtext-alignには、bodyに指定された値(right)が引き継がれる。なお、この値を指定しなくても、text-alignの値は子要素に引き継がれる。 |
| initial | プロパティの初期値が適用される。この場合、leftが適用される。 |
| left | テキストは左寄せになる。 |
| right | テキストは右寄せになる。 |
| center | テキストは中央寄せになる。 |
| justify | 要素の両端に文字がピッタリと付くように、文字の間隔が調整される。ただし、最終行には影響がない。最終行を調整するには、text-align-lastプロパティを利用する。 |
ブラウザのサポート
2016年7月現在の、ブラウザのサポート状況は次の通りです。全ての主要ブラウザで、ベンダープレフィクスなど気にすることなく利用できます。
Chrome
●
-
時期不明
Firefox
●
-
時期不明
Safari
●
-
時期不明
Ie
●
-
時期不明
Edge
●
-
時期不明
Opera
●
-
時期不明
Safari(iOS)
●
-
時期不明
Ie Mobile
●
-
時期不明
Chrome
●
-
時期不明
Android
●
-
時期不明
FF Mobile
●
-
時期不明
Opera Mobile
●
-
時期不明