TECH I.S.

CSS テキストの間隔


テキストの間隔

この章では、次のプロパティについて学習します。

  • text-indent
  • letter-spacing
  • line-height
  • word-spacing
  • white-space

テキストのインデント

text-indentプロパティは、テキストの最初の行のインデントを指定するために使用されます。

p {   text-indent: 50px; }

自分で試してみる »


文字間隔

letter-spacingプロパティは、テキスト内の文字間のスペースを指定するために使用されます。

次の例は、文字間のスペースを増減する方法を示しています。

h1 {   letter-spacing: 5px; } h2 {   letter-spacing: -2px; }

自分で試してみる »


行の高さ

line-heightプロパティは、行間のスペースを指定するために使用されます。

p.small {   line-height: 0.8; } p.big {   line-height: 1.8; }

自分で試してみる »


単語間隔

word-spacingプロパティは、テキスト内の単語間のスペースを指定するために使用されます。

次の例は、単語間のスペースを増減する方法を示しています。

p.one {   word-spacing: 10px; } p.two {   word-spacing: -2px; }

自分で試してみる »


ホワイトスペース

white-spaceプロパティは、要素内の空白の処理方法を指定します。

この例は、要素内でのテキストの折り返しを無効にする方法を示しています。

p {   white-space: nowrap; }

自分で試してみる »


CSS テキスト間隔のプロパティ

財産

説明

文字間隔 テキスト内の文字間のスペースを指定します
行の高さ 行の高さを指定します
テキストインデント テキストブロックの最初の行のインデントを指定します
空白 要素内の空白の処理方法を指定します
単語間隔 テキスト内の単語間のスペースを指定します


プログラミング学習を加速させる

プログラミングをプロの講師に教えてもらいませんか。

テックアイエスのプログラミングスクールは初心者も大歓迎です。年齢制限もありません。転職・副業に強く、挫折させない手厚いサポートで稼ぐ力を身につけましょう!

スクールの詳細