1. 現在位置:
  2. トップページ
  3. HP作成tips
  4. stylesheet
  5. 文字テキスト
文字色 |  表示位置 |  文字の装飾 |  文字と文字の間隔 |  単語と単語の間隔 |  1行目の字下げ |  均等割付 |  はみ出たテキスト | 
大文字と小文字の変換 |  下線の表示位置 |  表示位置(縦方向) |  改行・半角スペース・タブ |  拡大 | 
文字テキストfont
color(文字色を指定)
h1 {
color: red;
}
あああ
text-align 文字の表示位置
p {
text-align: center;
}

あああ

left (左側に表示)デフォルト
center (中央に表示)
right (右側に表示)
justify (両端に揃える)
text-decoration 文字の装飾(上線、下線、抹消線、点滅)を指定
p {
text-decoration: underline overline;
}

あああ

underline (下線)
overline (上線)
line-through (抹消線)
blink (点滅)
none (指定なし)デフォルト
letter-spacing 文字と文字の間隔
p {
letter-spacing: 0.5em;
}

ああああああ

間隔の指定は、数値+単位(px、em、他)で指定
デフォルトは normal(標準)(例:letter-spacing: normal)
word-spacing 単語と単語の間隔を指定
p {
word-spacing: 0.5em;
}
ああ ああ ああ

ああ ああ ああ

間隔の指定は、数値+単位(px、em、他)で指定
デフォルトは normal(標準)です。(例:word-spacing: normal)
writing-mode 文字の表記方向(縦横)を指定
p {
writing-mode: tb-rl;
}

あああああ

あああああ

tb-rl (縦書きにします)
lr-tb (横書きにします)デフォルト
text-indent 1行目の字下げを指定
p {
text-indent: 1em;
}

あああ
いいい

数値+単位(em、他)か %(割合)で指定
デフォルトは 0(インデントなし)(例:text-indent: 0)
text-justify 均等割付の形式を指定
p {
text-align: justify;
text-justify: auto;
}
p {
text-align: justify;
text-justify: distribute-all-lines;
}

あああ

あああ

text-overflow 領域をはみ出たテキストがある場合に、末尾に省略符号( ... )を表示するかどうかを指定
p {
width: 500px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}

ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ

ellipsis (はみ出た場合に「...」を表示します)
clip (「...」を表示しません)デフォルト
text-transform 大文字と小文字の変換を指定
p {
text-transform: capitalize;
}

aaaaaaaaaa

capitalize … (単語の先頭文字を大文字に変換)
uppercase … (すべてを大文字に変換)
lowercase … (すべてを小文字に変換)
none … (指定なし)デフォルト
text-underline-position 下線の表示位置を指定
p {
text-decoration: underline;
text-underline-position: above;
}

あああああaaaaa

above (文字の上、または右側に線を表示)
below (文字の下、または左側に線を表示)
vertical-align 表示位置(縦方向)を指定
.example {
vertical-align: super;
}
あああ
super (上付き文字にします)
sub (下付き文字にします)
baseline (標準位置)デフォルト
white-space 改行、半角スペース、タブの扱いを指定
p {
white-space: nowrap;
}
normal (標準)デフォルト
nowrap (自動改行を禁止)
pre (書いたままの形で表示)
zoom 拡大を指定
p {
zoom: 1.5;
}
あああああ

あああああ

数値(単位なし)か %(割合)で指定
デフォルトは normal(標準サイズ)です。(例:zoom: normal)