ホームページに文章を入力する・改行する

  • このエントリーをはてなブックマークに追加

文章に段落を付けたり、改行する

ホームページに文章を入力するには、WordやExcel、メモ帳などの文章作成ソフトやブログ、メールで文字を入力するのと同じように、body要素に書き込むことで表示されます。ですが改行したい所でEnterキーで改行しても、ホームページ上では改行されません。
段落を付けたり改行をするには、HTMLタグを使ってマークアップします。

文章に段落をつけるにはp要素を使う

文章はまとまりごとに段落を付けて区切ることで非常に見やすくなります。段落をつけるにはp要素を使います。
使い方は区切りたい部分を<p>タグ(開始タグ)と</p>タグ(終了タグ)で囲むだけ。
これだけで段落と段落の間に1行分くらいの余白ができます。

p要素の中で改行するにはbr要素を使う

入力した文章を途中で改行したい場合にはbr要素を使います。
br要素で改行した場合にはp要素の様に1行分の余白が付かずに改行されます。
また、br要素は終了タグは必要ありません。

文字のサイズや色を変えたい場合にはCSSを使う

CSSとはCascading Style Sheets(カスケーディング・スタイル・シート)というページのスタイルを指定するための言語です。
文字サイズや色を変えるだけでなく、背景色を付けたり、線を引いたりと、ホームページのレイアウトや配置をするのにとても重要になります。
詳しい紹介はまたの機会にしますが、文字サイズを変えたい場合には以下のようにします。

18pxとなっている部分を最小10pxから設定することができます。

文字の色を変えたい場合には以下のようにします。

青文字にした場合には「blue
緑文字にした場合には「green
黄色文字にした場合には「yellow
など、「red」となっている箇所を変更する事で色を変えることができます。
文字の色は16進数で細かく設定することもできます。

まとめ

・段落を付けるにはp要素を使う
・p要素を使って段落を付けると1行程度の余白が付く
・p要素内で改行するにはbr要素を使う
・br要素には終了タグは必要ない
・br要素で改行するp要素の様に余白は付かない
・文字サイズや色を変えたい場合にはCSSを使う

  • このエントリーをはてなブックマークに追加