HTML Paragraf

by

Untuk membuat konten artikel yang menarik, kamu harus paham element html untuk membuat paragraf.

Daftar Isi
  1. Fungsi Tag
  2. Jenis-jenis Align Paragraf HTML
  3. Penggunaan

Untuk membuat paragraf, dibutuhkan tag elemen <p>. Ya semudah itu. Format tagnya adalah:

<p>...</p>

Mengapa harus menggunakan tag ini?

Fungsi Tag <p>

Misal, kamu membuat konten dengan 20 paragraf. Tanpa menggunakan tag <p>, maka 20 paragraf tersebut diidentifikasikan menjadi 1 paragraf saja. Contoh: 

<!DOCTYPE html>
<html>
<head>
	<title>Belajar Paragraf HTML</title>
</head>
<body>
	Paragraf 1
	Paragraf 2
	Paragraf 3
	Paragraf 4
	Paragraf 5
</body>
</html>

Maka hasilnya adalah:

Kemudian kita coba menambahkan tag <p>.

<!DOCTYPE html>
<html>
<head>
	<title>Belajar Paragraf HTML</title>
</head>
<body>
	<p>Paragraf 1</p>
	<p>Paragraf 2</p>
	<p>Paragraf 3</p>
	<p>Paragraf 4</p>
	<p>Paragraf 5</p>
</body>
</html>

Hasilnya adalah:

Jenis-jenis Align Paragraf HTML

Align atau rata, adalah posisi paragraf itu rata ke arah mana. Ada 4 jenis atribut align paragraf p, yaitu:

  • align="left" yaitu rata kiri
  • align="right" yaitu rata kanan
  • align="center" yaitu rata tengah
  • align="justify" yaitu rata kanan dan kiri

Contoh penggunaan:

Rata kiri: <p align="left"> Ini contoh rata kiri</p>

Ini contoh rata kiri

Rata kanan: <p align="right"> Ini contoh rata kanan</p>

Ini contoh rata kanan

Rata tengah: <p align="center"> Ini contoh rata tengah</p>

Ini contoh rata tengah

Rata kanan-kiri:

<p align="justify"> Ini contoh rata kanan kiri, teksnya harus panjang banget. Kenapa? kalau tidak panjang nanti terlihat hanya rata kiri saja karena line hanya satu baris. Biar kelihatan hasilnya, line harus lebih dari 2 paling gak 3 atau 4 baris deh.</p>

Ini contoh rata kanan kiri, teksnya harus panjang banget. Kenapa? kalau tidak panjang nanti terlihat hanya rata kiri saja karena line hanya satu baris. Biar kelihatan hasilnya, line harus lebih dari 2 paling gak 3 atau 4 baris deh.

Lebih jelas lagi, saya jadikan satu file HTML: 

<!DOCTYPE html>
<html>
<head>
	<title>Belajar Paragraf HTML</title>
</head>
<body>
	<p align="left"> Ini contoh rata kiri</p>
	<p align="right"> Ini contoh rata kanan</p>
	<p align="center"> Ini contoh rata tengah</p>
	<p align="justify"> Ini contoh rata kanan kiri, teksnya harus panjang banget. Kenapa? kalau tidak panjang nanti terlihat hanya rata kiri saja karena line hanya satu baris. Biar kelihatan hasilnya, line harus lebih dari 2 paling gak 3 atau 4 baris deh.</p>
</body>
</html>

Hasilnya adalah:

Align ini juga bisa diatur dengan CSS, supaya kita tidak harus mengeditnya satu persatu. Kan capek.

Penggunaan <br>

Ada kalanya kita ingin menulis beberapa kalimat, masih dalam satu paragraf tapi kita ingin buat kalimat dibawahnya.

Solusinya mengugnakan <br> atau line break.

Perbedaan <p> dan <br> adalah jika menggunakan <br> maka masih dihitung satu paragraf. Hanya membuat baris baru saja. Contoh:

<!DOCTYPE html>
<html>
<head>
	<title>Belajar Paragraf HTML</title>
</head>
<body>
	Ini teks kalimat pertama <br>
	Ini teks kalimat kedua
	<p>ini teks paragraf pertama</p>
	<p>ini teks paragraf kedua</p>
</body>
</html>

Hasilnya:

Jika menggunakan <br> jarak antar kalimat tidak terlalu jauh secara default. Karena <br> hanya membuat baris baru saja, seperti kamu membuat kalimat yang panjang, kemudian kata selanjutnya ada dibawahnya.

Itu tadi adalah cara membuat paragraf di HTML, dasar-dasar ini penting supaya artikel yang kamu tulis di web lebih profesional.

Leave a Comment