段落文章に関するCSS
■文字の書体

■例{font-family:麗流隷書}

■例{font-family:
ＤＦＰ平成明朝体W9}

■例{font-family:
HGP創英角ﾎﾟｯﾌﾟ体}

■CSS
タグ{font-family:フォント名}
■HTML
<タグ style="font-family:フォント名">〜</タグ>
■文字の大きさ

■例{font-size:xx-small}

■例{font-size:
xx-large}

■例{font-size:24px}

■CSS
タグ{font-size:キーワード}
■HTML
<タグ style="font-size:キーワード">〜</タグ>
■キーワード
キーワード 意味
xx-small 超特小
x-small 特小
small 小
medium 標準
large 大
x-large 特大
xx-large 超特大
smaller より小さく
lerger より大きく
サイズで指定 サイズで指定する事もできます
■行の高さ

■CSS
タグ{line-height:サイズ}
■HTML
<タグ style="line-height:サイズ">
〜</タグ>
■文字の太さ

■例{font-weight:100}

■例{font-weight:lighter}

■例{font-weight:bolder}

■例{font-weight:900}

■CSS
タグ{font-weight:キーワード}
■HTML
<タグ style="font-weight:キーワード">〜</タグ>
■キーワード
キーワード 太さ
normal 通常
bold 太字
bolder より太く
lighter より細く
100 最も細く
900 最も太く
■文字のスタイル

■例{font-style:normal}

■例{font-style:italic}

■例{font-style:oblique}

■CSS
タグ{font-style:キーワード}
■HTML
<タグ style="font-style:キーワード">〜</タグ>
■キーワード
キーワード スタイル
normal 通常
italic イタリック
oblique 斜体
■スモールキャピタル

■例{font-variant:small-caps}

■CSS
タグ{font-variant:small-caps}
■HTML
<タグ style="font-variant:small-caps">〜</タグ>

■関連項目
■文字のスタイル、太さ、サイズ、書体を一括指定
■CSS
タグ{font:
スタイル 英字スタイル 太さ 文字サイズ/行の高さ 書体}
■HTML
<タグ style="font:
スタイル 英字スタイル 太さ 文字サイズ/行の高さ 書体">
〜</タグ>

■文字の修飾方法

■例{text-decoration:
underline}

■例{text-decoration:
overline}

■例{text-decoration:
underline overline}

■CSS
タグ{text-decoration:キーワード}
■HTML
<タグ style="text-decoration:キーワード">〜</タグ>
■キーワード
キーワード 修飾方法
none 通常
underline 下線
overline 上線(NN無効)
line-through 取り消し線
blink 点滅(IE無効)
■英字(大文字／小文字)自動変換

■例{text-transform:
capitalize}

■例{text-transform:
uppercase}

■例{text-transform:
lowercase}

■CSS
タグ{text-transform:キーワード}
■HTML
<タグ style="text-transform:キーワード">〜</タグ>
■キーワード
キーワード 変換方法
none 通常
capitalize 単語の先頭１文字のみ大文字にする
uppercase 全て大文字にする
lowercase 全て小文字にする
■行揃え

■例{text-align:
left}

■例{text-align:
right}

■例{text-align:
center}

■CSS
タグ{text-align:キーワード}
■HTML
<タグ style="text-align:キーワード">〜</タグ>
■キーワード
キーワード 揃え位置
left 左揃え
right 右揃え
center 中揃え
■字下げ

■例{text-indent:24px}

インデント(字下げ)とは、長文の１行１文字目の前に挿入される空白の事です。

■CSS
タグ{text-indent:サイズ}
■HTML
<タグ style="text-indent:サイズ">〜</タグ>
■文字間隔

■例{
letter-
spacing:
24px}

■CSS
タグ{letter-spacing:サイズ}
■HTML
<タグ style="letter-spacing:サイズ">〜</タグ>
■禁則処理

■CSS
タグ{word-break:キーワード}
■HTML
<タグ style="word-break:キーワード">〜</タグ>
■キーワード
キーワード 禁則処理
normal 単語ごと改行
break-all 単語／語句を無視して
強制的に改行
keep-all 単語／語句ごとに改行
■横幅

■例：この部分は、横幅100ピクセルです

■CSS
タグ{width:サイズ}
■HTML
<タグ style="width:サイズ">〜</タグ>
■文字色

■例{color:red}

■例{color:#000099}

■CSS
タグ{color:色}
■HTML
<タグ style="color:色">〜</タグ>
Presented by
HTML辞典