文章を入力して改行する
演習1.3 文章を入力して改行する
☑本文を記述する <body>○○○</body>
☑テキストを改行する <br>
Webページに表示させたい内容は、<body>○○○</body>で囲まれた部分に記述していきます。
また、内容（文章）には適切な箇所に、改行する<br>タグを使用しましょう。
1. HTMLファイルに文章を記述
<body>と</body>の間に、以下のように文章を記述してください。
①ソース・フォルダー ：html/ch06
②ファイル名 ：index.html
➢ index.html
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>子猫と子犬の部屋</title>
<body>
子猫と子犬の部屋にようこそ！
子猫と子犬のとってもかわいい写真をご用意しました。
今後も色々と紹介していきますので、楽しんでください。
</body>
</html>
6行目から8行目に、文章を記述しました。
まずはこの状態で上書き保存をしてから、ブラウザの表示を確認してみます。ブラウザ上で、文章が左詰めで表示され、文章がすべてつながって表示されます。
図 1.3.1
2. <br>タグを挿入して改行する
文章は改行しないと文字が続けて表示され、とても見難くなります。文章の区切りの良い所で<br>タグを入れて、文章を読みやすくしてみます。以下のように、6行目～8行目に、<br>タグを記述してください。
～前略～ 子猫と子犬の部屋にようこそ！<br> 子猫と子犬のとってもかわいい写真をご用意しました。<br><br> 今後も色々と紹介していきますので、楽しんでください。<br> ～後略～
「子猫と子犬のとってもかわいい写真をご用意しました。」の後には、<
br>タグを2つ続けて記述しています。こうすることで、1行分のスペースを確保しています。
3. HTMLファイルを保存
上の記述が終わったら、再度上書き保存をしてください。
4. ブラウザで表示
では、ブラウザで確認してみましょう。
図 1.3.2
<br>タグを挿入することで、文章が改行され内容が見やすくなりました。
