CSS基本チュートリアル

CSSボックスモデル

CSS3基礎教程

CSS リファレンスマニュアル

CSS @ルール(RULES)

CSS 垂直-align(垂直アライメント)CSS 属性选择器

CSS line-height(行高)

CSS line-height行間属性使用要素内で定義されたボックスの最小高さ。これは内容の2行間の間隔を設定します。

これはインライン要素の上側と下側のスペース量を定義します。これはフォントサイズに関係なく行の高さを設定することができます。

CSS 行高値

line-height属性値はCSS line-height属性は一緒に使用する必要があります。

値	説明
normal	これはデフォルト値です。これは正常な高さを指定します。
number	これは現在のフォントサイズと乗算された数字で行高を指定します。
length	これはpx、pt、cmなどで行高を設定するために使用されます。
%	これは現在のフォントのパーセンテージで行高を指定します。
initial	これはこの属性をデフォルト値に設定します。
inherit	これは親要素からこの属性を継承しています。

CSS 行高例

例

<!DOCTYPE　html>　　
<html>　　
<head>　　
<style>　　
h3.small　{　　
　　　　line-height:　70％;　　
}　　
h3.big　{　　
　　　　line-height:　200％;　　
}　　
</style>　　
</head>　　
<body>　　
<h3>　　
これはデフォルトの標準行間を持つ見出しです.<br>　　
これはデフォルトの標準行間を持つ見出しです.<br>　　
ほとんどのブラウザでデフォルトの行間は約110％から120％.<br>　　
</h3>　　
<h3　class="small">　　
これは行間が小さい見出しです.<br>　　
これは行間が小さい見出しです.<br>　　
これは行間が小さい見出しです.<br>　　
これは行間が小さい見出しです.<br>　　
</h3>　　
<h3　class="big">　　
これは大きな行間を持つ見出しです.<br>　　
これは大きな行間を持つ見出しです.<br>　　
これは大きな行間を持つ見出しです.<br>　　
これは大きな行間を持つ見出しです.<br>　　
</h3>　　
</body>　　
</html>

テストを見て‹/›

CSS 垂直-align(垂直アライメント)CSS 属性选择器