Cara membuat tab paragraf di html

Alexandromeo Lawrence Follow “If I only had an hour to chop down a tree, I would spend the first 45 minutes sharpening my axe.” – Abraham Lincoln.

June 24, 2018 2 min read

Ketika akan membuat website yang kaya akan tulisan, pasti akan lebih menarik jika tulisan atau konten tersebut dibagi menjadi beberapa paragraf. Karena hal itu akan lebih mudah dibaca oleh para pengunjung website Anda. Kalau Anda membuat website dengan CMS  seperti WordPress sih itu sudah ada tampilan GUI nya sehingga Anda tinggal menekan tombol tertentu untuk membuat paragraf.

  • Cara Membuat Paragraf Pada HTML
  • Membuat Paragraf dengan <p>
  • Membuat Paragraf dengan <p> yang Telah Diberi Atribut
  • Membuat Paragraf dengan </br>
  • Pertanyaan yang Sering Diajukan?

Cara Membuat Paragraf Pada HTML

Nah, berbeda ceritanya jika Anda membuat website dengan coding (pemrograman), Anda harus mengetikkan tag tertentu supaya Anda bisa membuat paragraf. Bagi Anda yang belum tahu apa itu tag, element maupun atribut, Anda bisa baca panduan di bawah ini :

Baca : Mengenal Apa itu Tag, Element, Atribut Beserta Contohnya Pada HTML

Di sini ada 2 cara dalam membuat paragraf dalam HTML, yaitu dengan menggunakan tag P (<p>) dan menggunakan tag BR (<br>). Keduanya akan dijelaskan di bawah.

Membuat Paragraf dengan <p>

Tag P (<p>) itu adalah singkatan dari paragraph. Jadi, pada dasarnya tag ini memang dirancang khusus bagi para pembuat website untuk membuat paragraf. Dengan kata lain, <p> itu berfungsi untuk membuat paragraf. Contoh penggunaannya adalah sebagai berikut :

[sourcecode language=”plain”]
<html>
<head>
<title>Cara Membuat Paragraf Pada HTML dengan Tag P</title>
</head>
<body>
<p>Ini adalah paragraf pertama</p>
<p>Ini adalah paragraf kedua</p>
<p>Ini adalah paragraf ketiga</p>
</body>
</html>
[/sourcecode]

Hasilnya adalah sebagai berikut :

Cara membuat tab paragraf di html

Walaupun tag p tidak ditulis di baris baru, tetap saja hasilnya akan berada di baris baru, karena hakikat paragraf adalah selalu dimulai pada baris baru. Jika Anda menuliskan tag p pada baris baru, maka jarak antara paragraf satu dengan yang lainnya juga semakin jauh.

Sekarang kita akan menggunakan tag p yang telah diberi atribut, baca artikel di bawah ini jika Anda belum tahu apa itu element dan atribut.

Baca : Mengenal Apa itu Tag, Element, Atribut Beserta Contohnya Pada HTML

Membuat Paragraf dengan <p> yang Telah Diberi Atribut

Jika di atas kita sudah membahas cara membuat paragraf dengan tag p yang masih murni, sekarang kita akan mencoba menggunakan tag p yang diberi atribut supaya bisa bervariasi. Lihat contoh di bawah ini :

[sourcecode language=”plain”]
<html>
<head>
<title>Membuat Paragraf Dengan Tag P</title>
</head>
<body>
<p align="left">Ini adalah paragraf rata kiri (default). Sekilas hampir sama dengan paragraf rata kiri kanan (justify), tetapi itu berbeda loh. Kalau kontennya pendek mungkin terlihat sama, tetapi kalau kontennya panjang akan terlihat bedanya.</p>
<p align="center">Ini adalah paragraf rata tengah.</p>
<p align="right">Ini adalah paragraf rata kanan.</p>
<p align="justify">Ini adalah paragraf rata kanan kiri (justify). Sekilas hampir sama dengan paragraf rata kiri, tetapi itu berbeda loh. Kalau kontennya pendek mungkin terlihat sama, tetapi kalau kontennya panjang akan terlihat bedanya.</p>
</body>
</html>
[/sourcecode]

Kita lihat hasilnya :

Cara membuat tab paragraf di html

Berbeda kan ? Paragrafnya ada yang berada di kiri, tengah, maupun kanan. Sebenarnya itu bisa diatur dengan CSS, Anda bisa belajar CSS dengan klik gambar di bawah ini :

Cara membuat tab paragraf di html

Pada contoh di atas kita menggunakan atribut align. Nah, value yang ada pada atribut align adalah :

  • left = Teks rata kiri
  • right = Teks rata kanan
  • center = Teks rata tengah
  • justify = Teks rata kiri kanan

Sudah jelas kan saat menggunakan tag p. Sekarang saatnya kita menggunakan tag br.

Membuat Paragraf dengan </br>

Tag br pada dasarnya memiliki arti break atau yang fungsinya untuk ganti baris. Jadi ketika menggunakan </br> itu sama saja kita membuat baris baru. Contoh kode programnya :

[sourcecode language=”plain”][/sourcecode]

<html>
<head>
<title>Membuat Paragraph Dengan Tag BR</title>
</head>
<body>
Ini adalah paragraf pertama</br>
Ini adalah paragraf kedua
</body>
</html>

Maka hasilnya adalah sebagai berikut :

Cara membuat tab paragraf di html

Hasilnya sama saja ketika kita menggunakan tag p untuk membuat suatu paragraf pada HTML. Demikianlah tutorial cara membuat paragraf pada HTML menggunakan tag P dan tag BR. Apabila ada yang belum paham bisa ditanykan di kolom komentar.

Pertanyaan yang Sering Diajukan?

Bagaimana cara membuat paragraf di HTML?

Paragraf pada HTML dibuat dengan tag <p> . Selain tag ini, ada juga tag pendukung lain seperti <div> , <hr> , <br> , dan <pre> .

Apa fungsi dari tag p >

HTML <p> element menunjukkan sebuah Paragraph, atau paragraf sebuah teks.

Apa itu br di HTML?

Tag <br/> adalah tag yang di sediakan pada html untuk membuat baris baru atau sering dan lebih mudah di sebut dengan membuat enter.

Apa tag dari HTML yang berfungsi untuk membuat baris baru?

Tag <br/> atau break, digunakan untuk membuat baris baru dengan keadaan tertentu. Jika kita lihat hasilnya dalam sebuah browser akan menampilkan tampilan sebagai berikut ini.