Cara Membuat Paragraf dalam HTML

Pada sebuah website pasti memiliki Paragraf, paragraf adalah komponen yang tidak dapat dipisahkan dari sebuah halaman website baik itu digunakan pada postingan, komentar, dan lain sebagainya. Nah pada tutorial kita kali ini saya akan membahas cara membuat paragraf di HTML. 

HTML menyediakan tag khusus untuk membuat paragraf. Penulisannya menggunakan huruf p, sebagai berikut : <p>Isi dari sebuah paragraf</p>. Untuk lebih mudah di mengerti teman-teman dapat menuliskan contoh coding dibawah ini :

<!DOCTYPE html>
<html>
<head>
<title>Point Website</title>
</head>
<body>
<p>Ini adalah paragfar saya yang pertama, Ini adalah paragfar saya yang pertama
  Ini adalah paragfar saya yang pertama, Ini adalah paragfar saya yang pertama.</p>

<p>Ini adalah paragfar saya yang kedua, Ini adalah paragfar saya yang kedua
  Ini adalah paragfar saya yang kedua, Ini adalah paragfar saya yang kedua.</p>

  Ini bukan sebuah paragraf,  ini bukan sebuah paragraf  Ini bukan sebuah paragraf, 


   Ini bukan sebuah paragraf,          ini bukan sebuah paragraf


             ini bukan sebuah paragraf         ini bukan sebuah paragraf
</body>

</html>

Save sebagai paragraf.html, lalu jalankan pada web browser.  


Dari hasil contoh diatas kita dapat melihat bahwa baris satu dan baris dua adalah paragraf, setiap tag paragraf, web browser akan memberikan spasi antar paragraf. Sedangkan pada baris ketiga itu bukan sebuah paragraf dikarenakan itu ditulis tanpa menggunakan tag <p>.

Perhatikan baris ketiga pada gambar hasil dari code html tadi, kita lihat bahwa hasil nya bahwa paragraf tersebut tidaklah berada pada baris berbeda, namun berada pada satu baris yang sama. Perlu teman-teman perhatikan bahwa Dalam HTMLspasi akan diabaikan.

Tag Break (<br>)

Pada HTML juga memiliki tag<br> yang berfungsi untuk memisahkan paragraf satu dengan paragraf lain nya, <br> adalah singkatan dari break. Agar mudah teman-teman untuk mengerti mari kita modifikasi code nya tadi menjadi seperti ini :

<!DOCTYPE html>
<html>
<head>
<title>Point Website</title>
</head>
<body>
<p>Ini adalah paragfar saya yang pertama, Ini adalah paragfar saya yang pertama<br>
  Ini adalah paragfar saya yang pertama, Ini adalah paragfar saya yang pertama.</p>

<p>Ini adalah paragfar saya yang kedua, Ini adalah paragfar saya yang kedua<br>
  Ini adalah paragfar saya yang kedua, Ini adalah paragfar saya yang kedua.</p>

  Ini bukan sebuah paragraf,  ini bukan sebuah paragraf<br>  Ini bukan sebuah paragraf, 


   Ini bukan sebuah paragraf<br>         ini bukan sebuah paragraf,


             ini bukan sebuah paragraf <br>        ini bukan sebuah paragraf
</body>
</html>

Mari kita jalankan pada web browser. 


Pada gambar ditas kita dapat melihat bahwa paragraf yang tadi nya satu baris dapat dipisahkan dengan <br> hinga menjadi dua baris. Perhatikan juga kaliamat Ini bukan sebuah paragraf hasilnya hampir sama dengan menggunakan tag <p>. Namun yang perlu diperhatikan pemisahan paragraf menggunakan tag <br> bukanlah untuk membuat paragraf. Tag <br> berfungsi untuk memisahkan sebuah bagian text dengan text lain. Jika yang kita butuhkan adalah struktur paragraf, maka gunakan tag <p>.

Perhatikan penulisan tag <br>, tag break adalah salah satu dari beberapa tag yang tidak memiliki tag penutup, dan bisa ditulis sebagai <br > atau </br>. Penulisan </br> merupakan bawaan dari xHTML yang dianggap lebih rapi. Namun dalam standar HTML5, penulisan <br> maupun </br> tetap dianggap valid.

Jika teman-teman mau membuat paragraf nya memiliki huruf tebal teman-teman tinggal menambahkan <b>Ini Tebal</b>. jika teman-teman mau membuat huruf miring teman-teman dapat menambahkan <i>Ini huruf miring</i>. Selain dari yang di atas pada HTML masih memiliki tag-tag lain nya yaitu :

Tag untuk penebalan dan pemiringan ( <strong> dan <em>).

Di dalam sebuah paragraf, kadang kita perlu untuk membuat penekanan pada kata-kata tertentu. Penekanan ini bisa dilakukan dengan menebalkan kata, atau dengan kata yang dimiringkan. Penggunaan nya adalah sebagai berikut :

<!DOCTYPE html>
<html>
<head>
<title>Point Website</title>
</head>
<body>

<p>Ini adalah paragfar saya yang pertama, <strong>Ini adalah paragfar saya yang pertama</strong><br>
<em>Ini adalah paragfar saya yang pertama</em>, Ini adalah paragfar saya yang pertama.</p>

<p>Ini adalah paragfar saya yang kedua, <em>Ini adalah paragfar saya yang kedua</em><br>
<strong>Ini adalah paragfar saya yang kedua,</strong> Ini adalah paragfar saya yang kedua.</p>

</body>
</html>

jika dijalankan pada web browser maka hasilnya akan seperti berikut :


Selain dari tag <em> dan <strong> kita juga akan menemukan bahwa HTML memiliki tag <i> (italic) untuk memiringkan huruf, dan <b> (bold) untuk menebalkan huruf. Pakar HTML yang mendukung pemisahan konten dengan tampilan tidak menyarankan menggunakan tag <i> dan <b>, karena kedua tag ini akan mempengaruhi tampilan dari HTML. Tampilan halaman web seharusnya di tangani oleh CSS, bukan di dalam kode HTML. Pada xHTML, tag <i> dan <b> sudah dianggap usang, dan tidak akan dipakai lagi, namun dalam spesifikasi HTML5, tag <i> dan <b> kembali dianggap relevan.

Sekian tutorial saya tentang Cara Membuat Paragraf dalam HTML, semoga dapat membantu teman-teman dalam mempelajari HTML. Untuk tutorial yang lain akan saya bahas pada tutorial selanjutnya.

No comments:

(c) eLMarco94. Powered by Blogger.