Sunday, February 24, 2019

HTML : Paragraf pada HTML

fajaryusuf.com

Setelah sebelumya Anda pelajari tentang HTML heading sekarang kita akan bahas tentang HTML paragraf untuk membuat paragraf atau deretan kalimat yang digabung menjadi satu untuk membahas topik tertentu.

HTML Paragraf


Untuk membuat paragraf di HTML, Anda cukup menggunakan tag <p>.

Contoh:

<!DOCTYPE html>
<html>
<body>
 
<h1>tutorial belajar HTML dasar di fajaryusuf.com</h1>
<p>Untuk belajar membuat paragraf dengan mudah</p>
<p>HTML adalah bahasa yang mudah untuk dipahami</p>
 
</body>
</html>


Silakan Anda coba di Notepad atau di HTML Editor FajarYusuf.Com dan Lihat Hasilnya. Anda akan melihat ada 2 buah paragraf disitu. Secara default, browser akan memberi jarak antara paragraf satu dengan paragraf yang lainnya.

fajaryusuf.com

Perbedaan Bentuk Paragraf


Mungkin muncul pertanyaan di dalam diri Anda, bagaimana tampilan paragraf di browser jika pengetikan paragraf di acak atau diberi enter seperti ini.

<!DOCTYPE html>
<html>
<body>
 
<h1>tutorial belajar HTML dasar di fajaryusuf.com</h1>
<p>Untuk belajar membuat
 
 
paragraf dengan mudah</p>
 
 
 
<p>HTML adalah
bahasa yang mudah
untuk dipahami</p>
 
</body>
</html>


Meskipun cara Anda mengetik paragraf seperti itu, HTML paragraf yang ditampilkan di browser tidak akan mengikuti cara penulisan Anda. Browser akan menghapus tambahan spasi atau enter yang Anda lakukan di HTML paragraf. Hasilnya akan sama seperti penulisan html sebelumnya diatas.

fajaryusuf.com

HTML Line Break


Solusi kalau Anda ingin memberi jarak atau meng-enter kalimat yang masih menjadi satu paragraf adalah dengan menambah HTML line break yang memiliki tag khusus yaitu <br/><br/> adalah tag kosong, jadi tolong diingat - ingat untuk menutupnya dengan / (slash). 

Disini Anda bisa membuat baris baru tanpa mengetik paragraf baru.

<!DOCTYPE html>
<html>
<body>
 
<h1>tutorial belajar HTML dasar di fajaryusuf.com</h1>
<p>Untuk belajar membuat
<br/>
paragraf dengan mudah</p>
 
<p>HTML adalah <br/>
bahasa yang mudah <br/>
untuk dipahami</p>
 
</body>
</html>

Silakan Anda coba menambahkan tag <br/> dan lihat perbedaan dengan sebelumnya.

HTML : Paragraf pada HTML

Tag Untuk Menebalkan dan Memiringkan


Dalam pembuatan paragraf, HTML sudah menyedia tag untuk menebalkan dan memiringkan huruf, kata, kalimat sampai paragraf. Saya akan memberi contoh satu per satu supaya Anda paham. Urutannya begini :
  1. Menebalkan dan memiringkan huruf
  2. Menebalkan dan memiringkan kata
  3. Menebalkan dan memiringkan kalimat
  4. Menebalkan dan memiringkan paragraf

<!DOCTYPE html>
<html>
<body>
 
<h1>tutorial belajar HTML dasar di fajaryusuf.com</h1>
<p><strong>U</strong>ntuk belajar membuat paragraf dengan mudah</p>
<p><em>U</em>ntuk belajar membuat paragraf dengan mudah</p>
 
<p><strong>Untuk</strong> belajar membuat paragraf dengan mudah</p>
<p><em>Untuk</em> belajar membuat paragraf dengan mudah</p>
 
<p><strong>Untuk belajar membuat paragraf dengan mudah, Anda bisa kunjungi fajaryusuf.com</strong> Karena tutorial dikemas menggunakan bahasa sederhana yang mudah dipahami</p>
 
<p><em>Untuk belajar membuat paragraf dengan mudah, Anda bisa kunjungi fajaryusuf.com</em> Karena tutorial dikemas menggunakan bahasa sederhana yang mudah dipahami</p>
 
<p><strong>Untuk belajar membuat paragraf dengan mudah, Anda bisa kunjungi fajaryusuf.com. Karena tutorial dikemas menggunakan bahasa sederhana yang mudah dipahami</strong></p>
 
<p><em>Untuk belajar membuat paragraf dengan mudah, Anda bisa kunjungi fajaryusuf.com. Karena tutorial dikemas menggunakan bahasa sederhana yang mudah dipahami</em></p>
 
</body>
</html>


Silakan Anda coba dan lihat perbedaannya masing - masing. Anda bisa coba untuk mengganti - ganti mana yang akan Anda ubah format penulisannya. Tapi hasil akhir kira - kira akan seperti ini.

HTML : Paragraf pada HTML

Penting !
 Anda akan menemukan bahwa HTML memiliki tag <i> untuk memiringkan tulisan dan tag <b> untuk menebalkan tulisan, fungsinya sama seperti <em> dan <strong>. Sebetulnya untuk memformat suatu huruf, kata, kalimat atau paragraf tidak disarankan menggunakan tag - tag ini.
Para pakar HTML lebih menyarankan untuk mengubah format penulisan menggunakan CSS. Meski begitu empat tag ini <i><em><b><strong> akan memberi efek yang sama kalau Anda gunakan. Silakan coba saja agar lebih paham

setelah Anda peajari membuat paragraf dengan menggunakan HTML paragraf, di tutorial selanjutnya akan kita bahas tentang HTML style yang berguna untuk menghias elemen HTML.


Reviewer: Fajar Yusuf
ItemReviewed: HTML : Paragraf pada HTML

Seseorang yang ingin membagi pengalaman dan ilmu yang berguna untuk para pembaca FajarYusuf.Com :)

Cobalah untuk memilih Pelajaran Pemrograman dan belajar dari Materi Pertama
EmoticonEmoticon


TENTANG SITUS

SITUS INI ADALAH SITUS PEMBELAJARAN PEMROGRAMAN DAN JUGA PEMAHAMAN TERHADAP TEKNOLOGI KOMPUTER. KALIAN BISA MENGIKUTI PEMBELAJARAN PEMROGRAMAN DENGAN BERTAHAP PADA MATERI YANG SUDAH SAYA SEDIAKAN, JIKA ADA MATERI YANG MEMBINGUNGKAN SILAKAN LAKUKAN KOMENTAR PADA MATERI YANG ANDA TANYAKAN ATAU KALIAN BISA MENGHUBUNGI SAYA DIHALAMAN KONTAK.