HTMLスキル - 第2章 Lesson7

段落である事を示す<p>タグの書き方

   

テクノロジーとクリエイティブのプロを目指す人のためのオンラインスクール
月額2500円で500以上のレッスンが受けられます

このスキルのデータをダウンロード: Windows Mac

Webページの文章である事を示す、<p>タグの書き方について解説しています。
<p>タグの書き方を覚えれば、どのようなものにも対応できる便利なタグなので、ぜひマスターしてください。



この動画で学べること

・<p>タグの使い方
・<br>タグの使い方



<p>タグで段落を作ってみよう

文章(段落)を表示させる方法を見ていきましょう。
まず、見出し1の下に、こちらの文章を貼り付けてください。


ーーーーーーーーーーーーーーーーーーーーーーーーー貼り付ける文章ーーーーーーーーーーーーーーーーーーーーーーーーーー


このサイトは、フリーランスウェブデザイナーとして活動をしているYumiのポートフォリオサイトです。おもに、今までの経歴や実績を紹介しています。
Yumiは、ウェブデザイナーとしてデザイン活動をする傍ら、ウェブデザイン講座の講師としてウェブデザインのノウハウをお話しています。
主に、Photoshopを使ったウェブデザイン方法と、HTMLとCSSを使ったマークアップを、初心者でもわかりやすく解説しています。


ーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーーー



貼り付けたれたら、一度保存してブラウザで見てみましょう。
エディターではエンターを押して改行していますが、ブラウザ上では改行がされていません。
では再度エディターに戻って段落の書き方を見ていきましょう。
2つの文章をそれぞれ<p>タグで囲みます。



保存してブラウザで見てみると、先ほどまで1つにつながっていた文章が、
<p>タグで区切ったところで2つに分かれました。




<br>タグで改行させてみよう

では段落の中で改行させたい場合についても説明します。
改行したい<p>タグの中で<br>タグを書きます。
これは、強制的に改行するタグです。<br>タグには終了タグがありません。
かけたら、一度保存してブラウザで見てみましょう。
<p>タグで改行された時とは、余白の取り方が少し違うことがわかります。