Belajar HTML part 5 Membuat Paragraf di HTML

 

jika di tutorial sebelumnya kita sudah membahas mengenai struktur dasar di HTML, di part 5 membahas mengenai cara membuat paragraf dan beberapa tag yang berhubungan dengan text.





Seperti yang anda ketahui peran paragraf cukup penting terhadap informasi yang ditampilkan di dalam website yang anda buat.





Sebenarnya kita bisa saja membuat artikel tanpa menggunakan tag paragraf, tetapi ada baiknya kita menggunakan tag paragraf yang telah ada di HTML, agar browser mendeteksi paragraf yang anda buat.





Nah untuk lebih mengetahui bagaimana peranan dari tag paragraf ini, silahkan ketikkan skrip dibawah didalam text editor anda.





<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
Ini paragraf pertama
ini paragraf kedua
</body>
</html>




semisal nih anda membuat 2 paragraf dengan skrip di atas, dan ditampilkan di dalam browser hasilnya adalah sebagai berikut :





paragraf tanpa tag paragraf html




seperti hasil diatas terlihat jika anda membuat lebih dari satu paragraf tanpa menggunakan tag paragraf, yang terjadi adalah kedua paragraf akan tetap dalam satu garis, karena itu ada baiknya anda menggunakan tag paragraf yang sudah di sediakan oleh html, untuk membuat 1 paragraf ataupun lebih.





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




dengan menggunakan skrip diatas jika anda buka di browser maka masing masing paragraf akan berada di garis berbeda.





tag-paragraf99




Keterangan :





  • Jadi ada baiknya jika memang membuat lebih dari satu paragraf menggunakan tag <p> dan di tutup dengan </p>





https://googleads.g.doubleclick.net/pagead/ads?guci=2.2.0.0.2.2.0.0&client=ca-pub-5950616551129814&output=html&h=171&slotname=9836807168&adk=3355630176&adf=2003464178&pi=t.ma~as.9836807168&w=682&fwrn=4&lmt=1611844454&rafmt=11&psa=1&format=682x171&url=https%3A%2F%2Fwww.warungbelajar.com%2Fbelajar-html-part-5-cara-membuat-paragraf-di-html.html&flash=0&wgl=1&adsid=ChEIgN7JgAYQu_jh6Mr58tPoARI9ALURu68kmytDnEvra_E_PsQWY6boeaBYlyjYoFWmhmP613Lg37DrYeYpOhXy4u3Xf7bZli4dCXXNE9JEhA&dt=1611844444879&bpp=6&bdt=926&idt=1434&shv=r20210125&cbv=r20190131&ptt=9&saldr=aa&abxe=1&cookie=ID%3D3a347e2e5f0d6f75-222f0dafcac5004f%3AT%3D1611282185%3ART%3D1611282185%3AS%3DALNI_Ma-PNYp7czgCQTC3dXBG7SwEmrsiQ&prev_fmts=682x171%2C0x0&nras=1&correlator=6003645491187&frm=20&pv=1&ga_vid=973230638.1611282182&ga_sid=1611844445&ga_hid=426056697&ga_fc=0&rplot=4&u_tz=420&u_his=1&u_java=0&u_h=768&u_w=1366&u_ah=720&u_aw=1366&u_cd=24&u_nplug=2&u_nmime=2&adx=47&ady=2738&biw=1079&bih=634&scr_x=0&scr_y=226&eid=21066649%2C42530672%2C21068108%2C21068769%2C21069000%2C21066973&oid=3&psts=AGkb-H9N0dBvQwhdFSFqxkFi0WLK9f18jWqOynJdT0qs6De10Wrh4a2mQg0TySd_fpOOX4G8bnDsSyXZYrji&pvsid=1150421158265741&pem=103&ref=https%3A%2F%2Fwww.warungbelajar.com%2Fbelajar-html-part-4-struktur-dasar-html.html&rx=0&eae=0&fc=896&brdim=5%2C24%2C5%2C24%2C1366%2C24%2C1104%2C720%2C1094%2C634&vis=1&rsz=%7C%7CeEbr%7C&abl=CS&pfx=0&fu=8320&bc=29&ifi=2&uci=a!2&btvi=1&xpc=aMiby4YoBH&p=https%3A//www.warungbelajar.com&dtd=10084




Tag <br> untuk ganti Baris





Setelah kita belajar tag paragraf, selanjutnya adalah tag <br/> biasanya digunakan untuk ganti baris, atau disebut break, seperti yang telah dijelaskan sebelumnya bahwa html tidak membaca spasi ataupun enter, karena itu untuk membuat text berganti baris silahkan gunakan tag <br/>





tag ini bersifat void element yang artinya tidak membutuhkan tag penutup.





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




maka yang terjadi ketika skrip di load di browser.





tag-br-html




Keterangan :





  • Terdapat beberapa pergantian baris pada text yang ditampilkan di browser, anda bisa menuliskan tag ini dengan beberapa option yaitu dengan tag <br> ataupun tag <br/>




Mengenal Tag <hr/>





tag ini digunakan untuk membuat sebuah garis di dalam HTML, sama seperti tag <br/> tag <hr/> ini juga bersifat void element atau tidak membutuhkan tag penutup.





<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
<p>Ini paragraf pertama</p>
<hr>
<hr>
<hr>
<p>ini paragraf kedua</p>
</body>
</html>




maka hasilnya ketika diakses melalui browser adalah :





tag-hr-html




Keterangan :





  • maka akan terbuat 3 garis seperti ini diantara kedua paragraf, anda bisa menuliskan tag ini dengan <hr> ataupun <hr/>




Nah sekian dulu pembahasan mengenai html di seri tutorial ke 5 ini, kita sudah belajar mengenai bagaimana cara membuat paragraf, serta bagaimana cara berganti garis dan memberikan garis dalam paragraf di html.


Lebih baru Lebih lama