KAWANO's PukiWiki Plus! - Lecture/JouhouC2010/2nd/paragraph の変更点

• 追加された行はこの色です。
• 削除された行はこの色です。
• Lecture/JouhouC2010/2nd/paragraph へ行く。

TITLE:段落と改行
*「段落」と「改行」をつくる [#d8688aa4]

**空白や改行の扱い [#j9d11b7b]
HTML文書では、空白や改行の扱い方が変わっています。
-空白 
--半角スペース: 何文字入力しても、ブラウザでは一文字の空白文字として表示 
--全角スペース: 入力した数だけの空白文字（全角）としてて表示
-改行 
--改行しても、ブラウザでは一文字の空白文字として表示

例えば、次のようなHTMLファイルは、
#pre(novervatim){{
これは   空白のテストです。
途中で改行しても
つづけて表示されます。
}}
ブラウザでは、次のように表示されます。
#pre(novervatim){{
これは 空白のテストです。 途中で改行しても つづけて表示されます。
}}


**「段落」をつくる [#l057d697]
段落を作るには、''p要素''を使います。

#pre(novervatim){{
COLOR(red):<p>COLOR(blck):...COLOR(red):</p>
}}

ここでの「段落」（パラグラフ）とは、
「１つの考えや意味を説明する文章の集まり」と考えてください。
日本語の段落とは違い、
最初の文字が１文字字下げされません。

段落と段落の間には、大き目の空白ができます。

***HTMLとブラウザでの表示例 [#y2bd1a8b]
#pre(novervatim){{
例：
COLOR(red):<p>
ここでは、私の自己紹介をします。
私の名前は、兵庫太郎です。年齢は１９歳です。
出身は、兵庫県加古川市です。
COLOR(red):</p>
COLOR(red):<p>COLOR(black):今は、ウェブとデザインを熱心に勉強しています。COLOR(red):</p>
}}

#ref(Lecture/JouhouC2010/2nd/paragraph/html01.png,nolink,段落の例)

**「改行」をつくる [#u209a79f]
要素の中で、強制的に改行を作るには、''br要素''を使います。

#pre(novervatim){{
COLOR(blck):...COLOR(red):<br>
}}

段落などの要素の中で、
文章を強制的に改行させたい場合は、
br要素をを使います。
この要素には、終了タグがありません。

なお、この要素を使って、
段落を表現することはやめてください。

#pre(novervatim){{
<h2>プロフィール</h2>
名前は、○○です。COLOR(red):<br>
出身地は○○です。COLOR(red):<br>
所属は○○学科です。
}}

&br;
&navi2(Lecture/JouhouC2010/2nd,next);進んでください。
----
#navi2(Lecture/JouhouC2010/2nd,prev,toc,next)