HPB18 | HPB19 コンテンツ一覧
ホーム > HPB19 > HTML 行間の空け方
目次 | 元のページ 前のページ | 次のページ サイトマップ | ページEND

HTML 行間の空け方


HTML 行間の空け方



行の間隔を調整する、行の間を空ける方法としては、スタイルシートで行間隔を指定することになります
(正確に言うと、各行の高さを指定します)

ヘッダー部で指定するとページ全体への設定に、ボディ部で指定すると、その段落への設定となります




ページ全体の設定


ヘッダー部に設定します

<head>

<style type="text/css">
<!--

body{
line-height : 170%;
}
or
p{
line-height : 170%;
}

-->
</style>

</head>


body 指定した場合は、ページ内全ての行間が変更されます
p 指定した場合は、ページ内特定の箇所を、<p>~</p>タグで囲うことにより、その場所の行間を調整できます




段落への設定


p 指定は、ボディ内に直接書くこともできます
その場合、それぞれの箇所で、行間を変えることができます

line-height : 150% の場合


<body>

<p style="line-height : 170%;"></p>

</body>


line-height : 100% の場合


<body>

<p style="line-height : 100%;"></p>

</body>





行間指定の値の単位


% (パーセント)指定
line-height: 170%

文字の標準サイズに対する比率を指定する ( 100% が標準サイズ )
em (エム)指定
line-height: 1.7em

文字の標準サイズに対する割合を指定する ( 1em が標準サイズ )
px (ピクセル)指定
line-height: 20.4px

一行の高さをピクセル単位で指定する

目次 | 元のページ 前のページ | 次のページ サイトマップ | ページTOP
ホーム > HPB19 > HTML 行間の空け方
HPB18 | HPB19 コンテンツ一覧
   

© 2014 abhp.net All Rights Reserved.
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP
ページTOP