最終更新日 2021年6月17日

text-alignプロパティ

text-alignは、テキストの水平方向の配置を指定するプロパティです。

CSS3では、新しいキーワードとして、start、end、match-parentの3つが追加されました。

新しいキーワードに加え、表のセル内で数値を小数点で揃えるなど、配置の基準とする1文字を指定できるようになります。また、値を2個指定して、1行目と残りの行の配置をそれぞれ指定することも可能です。

CSS3での変更点

・値に、start、end、match-parentが追加されました。

初期値	適用先	継承
start	ブロックレベル要素	あり

値	説明
start	文字を行ボックスの先頭に揃えて配置します。（初期値）
end	文字を行ボックスの末尾に揃えて配置します。
left	文字を行ボックスの左端に揃えて配置します。
right	文字を行ボックスの右端に揃えて配置します。
center	文字を行ボックスの中心に配置します。
justify	text-justifyの指定に従います。
match-parent	inheritの指定と同様です。ただし、startやendは、親要素のdirection値に従います。

サンプルコード

text-align: start;
text-align: end;
text-align: left;
text-align: right;
text-align: center;
text-align: justify;
text-align: match-parent;
text-align: "." center;
text-align: "年" center;

参考文献：CSS Text Level 3

当サイトの活動をサポートしてみませんか？気軽にクリエイターの支援ができます。