Elemen <p> digunakan untuk mendefinisikan paragraf didalam dokumen HTML. Dalam penyajiannya, browser secara otomatis akan menambahkan margin sebelum dan sesudah paragraf, sehingga sebuah paragraf selalu di mulai dengan baris baru.
Jadi, saat anda menuliskan elemen paragraf di baris baru, anda sudah tidak perlu lagi menambahkan elemen break line atau tag <br>. Misalnya saat anda ingin menulis 3 buah paragraf seperti ini :
<!DOCTYPE html>
<html>
<body>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
<p>This is a paragraph.</p>
</body>
</html>
Saat script tersebut dijalankan maka hasilnya akan seperti ini :
This is a paragraph.
This is a paragraph.
This is a paragraph.
Sekarang kita lihat, bahwa untuk memisahkan baris antar paragraf, tidak perlu lagi kita memasukan elemen break line
<br>.
Permasalahan yang kemudian muncul adalah, kita tidak bisa menentukan secara pasti bagaimana HTML akan di tampilkan jika hanya mengandalkan permainan spasi dan baris saja saat penulisan dokumen HTML. Ini karena browser secara otomatis akan membuang ekstra spasi dan baris saat page di tampilkan.
Sekarang mari kita lihat contoh berikut :
<!DOCTYPE html>
<html>
<body>
<p>
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
</p>
<p>
This paragraph
contains a lot of spaces
in the source code,
but the browser
ignores it.
</p>
<p>
The number of lines in a paragraph depends on the size of the browser window. If you resize the browser window, the number of lines in this paragraph will change.
</p>
</body>
</html>
Anda akan melihat ekstra spasi dan baris yang di buat tidak mempengaruhi tampilan saat script dijalankan :
This paragraph
contains a lot of lines
in the source code,
but the browser
ignores it.
This paragraph
contains a lot of spaces
in the source code,
but the browser
ignores it.
The number of lines in a paragraph depends on the size of the browser window. If you resize the browser window, the number of lines in this paragraph will change.
TAG <hr>
