Jumat, 08 Juni 2018

HTML Dasar Part 3 : Mengenal Heading dan Paragraf

HTML Dasar Part 3 : Mengenal Heading dan Paragraf



Seperti biasa sebelum memulai belajar alangkah baiknya berdo'a terlebih dahulu.

Ok kali ini kita sudah masuk kepembelajaran selanjutnya yaitu di Part-3 yang akan membahas tentang Tag Heading dan Tag Paragraf

Apa sih Tag Heading?

Tag Heading yaitu tag yang digunakan untuk membuat judul pada website.

Apa sih Tag Paragraf?

Tag Paragraf yaitu tag yang digunakan untuk membuat paragraf pada website.

   Ok untuk lebih jelasnya mari kita praktekkan, dan setelah kita praktekkan baru kita bisa mendapat kesimpulan dari Tag Heading dan Tag Paragraf.

Ikuti langkah-langkahnya :

1. Jika yang sudah mempunyai atau mengikuti tutorial sebelum-sebelumnya, bisa langsung buka file latihan.html yang telah dibuat pada pembelajaran part 1 dan part 2, tetapi jika yang ingin langsung belajar di part 3 ini silahkan tulis koding dibawah ini menggunakan text editor dan menyimpannya dengan format latihan.html, dan bagi yang sudah memiliki latihan.html cukup hanya menambahkan tag-tag pada bagian tag body.
**Direkomendasikan untuk mempelajari part-part sebelumnya.
<html>
  <head>
    <title> Web Ku </title>
  </head>

  <body>

   <h1> Heading 1 </h1>
   <h2> Heading 2 </h2>
   <h3> Heading 3 </h3>
   <h4> Heading 4 </h4>
   <h5> Heading 5 </h5>
   <h6> Heading 6 </h6>

  </body>
</html>

2. Seperti biasa jika akan mencoba atau melihatnya pada browser, jangan lupa save terlebih dahulu kode tersebut
3. Kemudian klik 2 kali pada file latihan.html, dan otomatis browser akan terbuka, maka hasilnya akan seperti ini :

**Penjelasan : Semakin kecil nilai dari tag heading, maka akan semakin besar teks yang akan muncul, dan sebaliknya jika semakin besar nilai dari tag heading, maka akan semakin kecil teks yang akan muncul
** Tag heading terdiri dari 6 (enam) tingkatan, yaitu <h1>, <h2> <h3>, <h4>, <h5>, dan <h6>

4. Selanjutnya buat tag paragraf, buat kode seperti dibawah ini :


<html>
  <head>
    <title> Web Ku </title>
  </head>

  <body>

   <h1> Heading 1 </h1>
   <h2> Heading 2 </h2>
   <h3> Heading 3 </h3>
   <h4> Heading 4 </h4>
   <h5> Heading 5 </h5>
   <h6> Heading 6 </h6>

   <p> Selamat datang di website ku </p>

  </body>
</html>


5. Kemudian refrash browser yang anda gunakan, maka hasilnya akan seperti ini :

**Penjelasan : pada Tag paragraf ini, teksnya sudah tidak terlihat tebal (bold) lagi seperti pada Tag Heading.

Bersambung....

Rangkuman :

  • Tag Heading adalah tag yang digunakan untuk membuat sebuah judul pada sebuah halaman web dan teksnya sendiri berukuran dan lebih tebal dari teks biasa. Tag Heading terdiri dari 6 (enam) tingkatan, yaitu <h1>, <h2> <h3>, <h4>, <h5>, dan <h6> dimana semakin kecil nilai dari tag heading, maka akan semakin besar teks yang akan muncul, dan sebaliknya jika semakin besar nilai dari tag heading, maka akan semakin kecil teks yang akan muncul. Biasanya <h1> hanya digunakan satu kali dalam sebuah halaman web, yaitu sebagai judul utama, <h2> sampai <h6> bisa digunakan beberapa kali sebagai sub judul.
  • Tag paragraf adalah tag yang digunakan untuk memulai suatu paragraf baru.


Ok sekian pembelajaran pada part 3 tentang tag heading dan tag paragraf, semoga bermanfaat 😎

Berdo'a selesai belajar.

Untuk pembelajaran selanjutnya bisa dilihat di Part 4

HTML Part 4 >>>

Tidak ada komentar:

Posting Komentar