Paragraf HTML

Sebuah paragraf selalu dimulai pada baris baru, dan biasanya merupakan blok teks.

Elemen Paragraf HTML

Elemen HTML <p> mendefinisikan sebuah paragraf.

Sebuah paragraf selalu dimulai pada baris baru, dan browser secara otomatis menambahkan beberapa ruang putih (margin) sebelum dan setelah paragraf.

Contoh

<p>Ini adalah sebuah paragraf.</p>
<p>Ini adalah paragraf lainnya.</p>

Tampilan HTML

Anda tidak dapat memastikan bagaimana HTML akan ditampilkan.

Layar besar atau kecil, serta jendela yang diubah ukurannya, akan menghasilkan tampilan yang berbeda.

Dengan HTML, Anda tidak dapat mengubah tampilan dengan menambahkan spasi ekstra atau baris kosong dalam kode HTML Anda.

Browser akan secara otomatis menghapus spasi dan baris kosong yang berlebih ketika halaman ditampilkan:

Contoh:

<p>
  Paragraf ini
  mengandung banyak baris
  dalam kode sumber,
  tetapi browser
  mengabaikannya.
</p>
 
<p>
  Paragraf ini
  mengandung         banyak spasi
  dalam kode sumber         ,
  tetapi browser
  mengabaikannya.
</p>

Aturan Horizontal HTML

Tag <hr> mendefinisikan pemisah tematik dalam halaman HTML, dan biasanya ditampilkan sebagai garis horizontal.

Elemen <hr> digunakan untuk memisahkan konten (atau mendefinisikan perubahan) dalam halaman HTML.

Contoh:

<h1>Ini adalah heading 1</h1>
<p>Ini adalah teks.</p>
<hr>
<h2>Ini adalah heading 2</h2>
<p>Ini adalah teks lainnya.</p>
<hr>

Tag <hr> adalah tag kosong, yang berarti bahwa tag ini tidak memiliki tag penutup.

Break Baris HTML

Elemen HTML <br> mendefinisikan pemisah baris.

Gunakan <br> jika Anda ingin pemisah baris (baris baru) tanpa memulai paragraf baru.

Contoh:

<p>Ini adalah<br>paragraf<br>dengan pemisah baris.</p>

Baris Sajak dalam HTML

Anda pasti kenal sajak berikut:

<p>
  Burung kakak tua
  Hinggap di jendela
  Nenek sudah tua
  Giginya tinggal dua
</p>

Sayangnya, di HTML sajak tidak bisa menggunakan p, karena pastinya akan ditulis dalam satu baris.

Solusi: Gunakan <pre> untuk Sajak

Elemen HTML <pre> mendefinisikan teks yang diformat sebelumnya.

Teks di dalam elemen <pre> ditampilkan dalam font lebar tetap (biasanya Courier), dan mempertahankan spasi serta pemisah baris:

<pre>
  Burung kakak tua
  Hinggap di jendela
  Nenek sudah tua
  Giginya tinggal dua
</pre>