HTML、CSSに関して

質問

HTMLの初心者です。いくつかご質問させていただきます。

①段落と段落の間に行間を空けたい場合、必ずCSSを使わなければなりませんか？行間を空けたい場合、HTMLの本文中で段落と段落の間に行間を空けて記述するのは間違っていますか？例えば以下のような例文です。

〈p〉ここでは私が旅先で撮影した写真を掲載しています。日本列島津々浦々、特に温泉巡り、行く先々の海の幸、山の幸には目がありません。〈/p〉

〈p〉それでは当サイトをお楽しみください。〈/p〉

このようなHTMLでもブラウザ表示は行間が空いて表示されると思うのですが。

②CSSの書式として以下のような書式があります。

p{font-size: 1.3em;}

このpというのは何ですか？CSSの書式を記述するときに使うものということで深く考える必要はありませんか？また字間についてですが、:と1.3emの間に半角スペースを必ず入れるということは知っていますが（手持ちのホームページ作成入門本にそう書いてあります）、pと{の間にスペースを入れる必要はありませんか？

③行間を調整するCSSを記述した以下のファイルを例文として記載します。上記の手持ちのホームページ作成入門本から抜粋しています。

〈html〉
〈head〉
〈title〉序文に変えて〈/title〉
〈style type="text/css"〉
p{line-height 150%;}
〈/style〉
〈/head〉

〈body〉

〈h1〉序文に変えて〈/h1〉

〈p〉ようこそ、このサイトではラーメンマニアの私が食べ歩いたラーメンを写真付きで紹介しています。

〈/body〉
〈/html〉

この150%という値ですとファイルをブラウザにドロップしたとき〈p〉タグの内容の行間が少し広くなります（と入門本に記載があります）。普通に本文の文字の大きさで1行分空けたい時はどうすればいいですか？つまり現在知恵袋で記載しているような1行分です。150%ではなく1emと記述すればいいですか？また、このCSS書式のp{line-height 150%;}ではline-heightと150%の間に質問②で記載したCSS書式のような:がありません。設定名と値の間は:で区切っても半角スペースでもどちらでもいいのですか？

宜しくお願いします。( ｀・∀・´)

回答No.1

t_ohta

(1) HTML内の改行は表示するとき無視されるので、行間を開けても開けなくても同じです。
見やすくするために間を開けても問題ありません。

(2) p タグに対してフォントサイズを 1.3em に指定するという記述です。
書式を適用したいタグ名を書き、続けて { } の間に書式を記述します。
タグ名と { の間にスペースを入れる必要はありませんが、見やすくするために半角スペースを入れても問題ありません。

(3) line-height は1行の高さを指定するモノです。
％で指定する場合は、その行の文字の高さを基準に行の高さを何％にするか指定する記述方法で、150％と言うのは行の高さが文字の高さの1.5倍になるという意味ですから、文字と文字の行間に、0.5文字分の空白が出来ます。
1文字分の空白を開けたければ 200%と指定することになります。