CSS テキストの配置

CSSテキスト CSSテキスト装飾

テキストの配置

text-align 属性は、テキストの水平方向の配置を設定するために使用されます。

テキストは左揃え、右揃え、または中央揃えにすることができます。

次の例は、中央揃えと左揃えのテキストを示しています (テキスト方向が左から右の場合、デフォルトは左揃えです。テキストの方向が右から左の場合、デフォルトは右揃えです)。整列):

h1 {
  text-align: center;
}

h2 {
  text-align: left;
}

h3 {
  text-align: right;
}

自分で試してみてください

text-align 属性が「justify」に設定されている場合、各行は均等な幅になり、左右の余白が真っ直ぐになるように引き伸ばされます(雑誌や雑誌のように)新聞):

div {
  text-align: justify;
}

自分で試してみてください

テキストの方向

direction 属性と unicode-bidi 属性を使用して、要素のテキストの方向を変更できます。

p {
  direction: rtl;
  unicode-bidi: bidi-override;
}

自分で試してみてください

垂直方向の配置

vertical-align 属性は、要素の垂直方向の配置を設定します。

この例は、テキスト内の画像の垂直方向の配置を設定する方法を示します。

img.top {
  vertical-align: top;
}

img.middle {
  vertical-align: middle;
}

img.bottom {
  vertical-align: bottom;
}

自分で試してみてください