www.WarungProgram.com

Tempat Belajar Bahasa Pemrograman Dari Dasar


Tutorial HTML : Membuat Paragraf Dan Judul

Penulis : Zulfikar Kategori : Belajar HTML

Membuat Paragraf Dan Judul Di Html

Ini adalah ada seri ke 3 dari Tutorial Belajar Html Dari Dasar Pada tutorial html kali ini kita akan belajar membuat Paragraf dan judul di html.

Untuk menformat text menjadi sebuah paragraf dan judul di html, html menyediakan tag <p> untuk paragraf dan tag <h> untuk judul.

 

Tag Paragraf

Html menyediakan tag <p> untuk membuat paragraf di html.

Jika kita mengetik text di dalam html tanpa menggunakan tag paragraf meskipun text nya kita bentuk seperti paragraf beberapa baris, text akan tetap di tampilkan dalam 1 baris.

Sebagai contoh :

<html>
  <head>
    <title>Tanpa Paragraf Tag Html</title>
  </head>
  <body>
    Ini Adalah Baris Pertama
    Ini Adalah Baris Kedua
  </body>
</html>
Tanpa Paragraf Tag Html

Tanpa Paragraf Tag Html

 

Dapat kita lihat dari gambar di atas, meskipun kita mengetikan text nya dalam 2 baris, web browser tetap menampilkan nya dalam 1 baris.

Ini karena text di atas tidak menggunakan paragraf tag html.

Untuk mendapatkan hasil yang sesuai, kita bisa menggunakan tag html <p>, maka penulisan markup html nya menjadi seperti ini :

 

<html>
  <head>
    <title>Dengan Paragraf Tag HTML</title>
  </head>
  <body>
    <p>Ini Adalah Baris Pertama</p>
    <p>Ini Adalah Baris Kedua</p>
  </body>
</html>
Dengan Paragraf Tag Html

Dengan Paragraf Tag Html

Kali ini tampilan nya sudah sesuai dengan yang kita inginkan, text di tampilkan dalam 2 baris.

Html Tag <br />

Ada tag html lain yang dapat kita gunakan untuk menformat text agar muncul di baris selanjutnya yaitu tag <br>

Tag <br> di gunakan untuk memberikan line break, sehingga dengan tag <br> kita bisa membuat sebuah text di dalam paragraf tag muncul pada baris selanjutnya.

Contoh :

<html>
  <head>
  </head>
  <body>
    <p>Ini baris pertama<br /> Ini Baris Kedua</p>
  </body>
</html>

 

Tag Judul

Untuk membuat judul, html menyediakan tag heading dengan berbagai macam ukuran mulai dari tag <h1> sampai tag <h6> ada 6 jenis heading yang di sediakan oleh html.

Ukuran terbesar di mulai dari tag <h1> dan seterusnya hingga yang terkecil tag <h6>. Ketikan markup html di bawah ini dan simpan dengan file extension .html misalnya tagjudul.html lalu buka di web browser untuk melihat hasilnya.

Contoh :

<html>
  <head>
  </head>
  <body>
    <h1>Ini tag judul h1</h1>
    <h2>Ini tag judul h2</h2>
    <h3>Ini tag judul h3</h3>
    <h4>Ini tag judul h4</h4>
    <h5>Ini tag judul h5</h5>
    <h6>Ini tag judul h6</h6>
  </body>
</html>

Silahkan di praktekan materi seri ke 3 ini untuk memformat text di html menjadi sebuah paragraf dan sebuah judul.

 

< Tutorial HTML Sebelumnya

Tutorial HTML Selanjutnya >

 

*
*


Dapatkan Tutorial Terbaru Dari WarungProgram.com

Tutorial Lainnya

Kategori