Cara Membuat Paragraf Di HTML

View Categories

Cara Membuat Paragraf Di HTML

Paragraf adalah suatu sekelompok barisan tulisan atau suatu blok tulisan pada dokumen HTML. Web browser pada umumnya akan menambahkan satu baris kosong sebelum dan sesudah suatu paragraf.

<p>This is a paragraph.</p>
<p>This is another paragraph.</p>

Jalankan Contoh

Contoh di atas memperlihatkan dua paragraf.

Tampilan Pada Web Browser

Tampilan paragraf saat ditampilkan pada browser bisa bervariasi. Ukuran huruf dan lebar baris baru tergantung pada jenis browser dan juga ukuran layar.

Web browser juga akan merapikan tampilan paragraf secara otomatis. Kelebihan spasi atau baris akan dihapus dan dirapikan otomatis oleh browser.

<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>

Jalankan Contoh

Contoh di atas akan menghasilkan tampilan dua paragraf yang relatif sama pada browser. Semua kelebihan spasi dan baris akan dihilangkan dan dirapikan secara otomatis.

Garis Pembatas Paragraf

Paragraf bisa mempunyai garis pembatas horizontal. Tag hr berfungsi untuk membuat garis pembatas horizontal yang memisahkan dua paragraf. Tag hr adalah tag kosong yang tidak mempunyai konten dan tag penutup.

<h1>This is heading 1</h1>
<p>This is some text.</p>
<hr>
<h2>This is heading 2</h2>
<p>This is some other text.</p>
<hr>

Jalankan Contoh

Baris Baru Dalam Paragraf

Paragraf juga bisa mempunyai baris baru apabila memang diperlukan. Tag br dapat digunakan untuk membuat baris baru. Tag br adalah elemen kosong yang tidak mempunyai konten dan tag penutup.

<p>This is<br>a paragraph<br>with line breaks.</p>

Jalankan Contoh

Paragraf Tanpa Format

Paragraf juga bisa ditampilkan tanpa otomatis dirapikan. Sebagai contoh dalam kasus penulisan puisi. Setiap baris puisi harus ditampilan dalam satu baris.

 <p>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</p>

Jalankan Contoh

Apabila suatu puisi ditulis dalam paragraf maka semua baris puisi di atas akan ditampilkan dalam satu baris saja sebab browser otomatis merapikan isi paragraf.

Solusi dari kasus di atas adalah dengan menggunakan paragraf tanpa format. Gunakan tag pre untuk keperluan ini.

<pre>
  My Bonnie lies over the ocean.

  My Bonnie lies over the sea.

  My Bonnie lies over the ocean.

  Oh, bring back my Bonnie to me.
</pre>

Jalankan Contoh

Web browser tidak akan otomatis merapikan konten di dalam tag pre.

Tutorial sebelumnya : Cara Membuat Heading Di HTML
Tutorial setelahnya : Atribut HTML
Semua Tutorial HTML : Tutorial HTML 

Tinggalkan Balasan