Beranda / HTML

Tag dan Elemen Dasar HTML

Posting Komentar

Ingin belajar peromgraman web? Tentunya bahasa pemrograman yang harus dipelajari pertama kali adalah HTML. Karena HTML adalah bahasa standard yang digunakan untuk menampilkan halaman web. Tentu saja Anda harus memulainya dari dasar-dasar HTML, salah satunya adalah Tag dan Elemen yang ada di HTML.

Apa saja? Sebelum itu, Anda harus tahu terlebih dahulu pengertian HTML beserta fungsi-fungsinya. Saya akan sedikit menjelaskan mengenai hal tersebut. Kuy! Disimak penjelasannya.

Apa itu HTML?

Hypertext Markup Language (HTML) adalah bahasa standard yang digunakan untuk menampilkan halaman web. Yang dapat dibantu oleh teknologi seperti Cascading Style Sheets (CSS) dan bahasa scripting seperti JavaScript dan VBScript.

Yang bisa dilakukan dengan HTML yaitu:

  1. Mengatur tampilan dari halaman web beserta isinya.
  2. Membuat tabel dalam halaman web.
  3. Mempublikasikan halaman web secara online.
  4. Membuat form yang bisa digunakan untuk menangani registrasi dan transaksi via web.
  5. Menambahkan objek-objel seperti audio, video dan animasi dalam halaman web.
  6. Menampilkan area gambar (canvas) di browser.

Itulah sedikit penjelasan mengenai HTML dan fungsi-fungsinya. Selanjutnya, langsung saja Kita bahas inti dari artikel ini. Kuy!

Tag dan Elemen HTML

Penanda perintah di dalam HTML biasanya disebut Tag. Tag digunakan untuk  menentukan tampilan dari dokumen HTML.

Tag ada yang berpasangan dengan format berikut:

<BEGIN TAG> isi dokumen </END TAG>

Tag ada juga yang tidak berpasangan dengan format berikut ini: 

<TAG> isi dokumen

Namun perlu diperhatikan bahwa tag <p> (paragraf) lebih baik diakhiri dengan tag </p> karena untuk kedepannya, HTML mengharuskan penggunaan end tag.

Contoh: Setiap dokumen HTML diawali dan diakhiri dengan tag HTML. 

<html>
    <head>
        ...
    </head>
    <body>
        ...
    </body>
</html>

1. Head

Elemen HEAD adalah kepala dari dokumen HTML. Tag <head> dan tag <head> terletak di antara tag <html> dan tag </html>. 

<head>
    ...
</head>

2. Title

Elemen TITLE merupakan judul dari dokumen HTML yang ditampilkan pada judul jendela browser. Tag <title> dan tag </title> terletak di antara tag <head> dan tag </head>. 

<head>
    <title>...</title>
</head>

3. Body

Elemen ini untuk menampilkan isi dokumen HTML. Tag <body> dan tag </body> terletak dibawah tag </head>. Elemen BODY mempunyai attribute-attribute yang menspesifikasikan khususnya warna dan latar belakang dokumen yang akan ditampilkan pada browser. 

<body text="v" bgcolor="w" background="uri" link="x" alink="y" vlink="z">
    ...
</body>

Keterangan:

  • Bentuk dari tag HTML adalah <ELEMENT ATTRIBUTE="value">
    • Elemen: Nama tag
    • Attribute: Atribut dari tag
    • Value: Nilai dari atribut.
  • text: Memberikan warna pada teks.
  • bgcolor: Memberikan warna pada latar belakang dokumen HTML.
  • background: memberikan latar belakang dokumen HTML dalam bentuk gambar.
  • link: Memberikan warna untuk link.
  • alink: Memberikan warna untuk link yang sedang aktif.
  • vlink: Memberikan warna untuk link yang telah dikunjungi.

Contoh:

<html>
    <head>
        <title>Karya Pertamaku</title>
    </head>
    <body bgcolor="yellow" text="red">
        Tulisan ini akan tampak dalam browser.
    </body>
<html>
<html>
    <head>
        <title>Karya Pertamaku</title>
    </head>
    <body bgcolor="#ffff00" text="#ff0000">
        Tulisan ini akan tampak dalam browser.
    </body>
<html>
Hasil
Hasil

Bila Anda amati, hasil dari kedua code tersebut akan menampilkan warna halaman yang sama bukan?

4. Paragraf dan Pemformatan Teks

Penulisan paragraf bisa menggunakan tag <p>. Adapun untuk memformat tulisan/text bisa menggunakan berbagai macam tag sesuai dengan keperluannya, antara lain sebagai berikut:

  1. <b> : Membuat teks tercetak tebal.
  2. <em> : Membuat penekanan pada teks (emphasized).
  3. <i> : Membuat teks tercetak miring.
  4. <u> : Membuat teks tercetak bergaris bawah.
  5. <small> : Membuat teks tercetak kecil.
  6. <strong> : Menyatakan bahwa teks tersebut penting.
  7. <sub> : Membuat teks tercetak sebagai subscript.
  8. <sup> : Membuat teks tercetak sebagai superscript (pangkat).
  9. <ins> : Menyatakan teks yang diapit tag <ins> itu disisipkan.
  10. <del> : Menyatakan teks yang diapit tag <del> itu dihapus (dicoret).
  11. <mark> : Menyatakan teks yang ditandai (highlighted). Efeknya seperti tulisan yang diberi "stabilo".

Contoh:

<html>
    <head>
        <title>Tipe-tipe Teks</title>
    </head>
    <body>
        <p>
            Ada tiga macam tipe tulisan:<br>
            <b>Tebal</b>, <i>miring</i> dan <u>bergaris bawah</u>
            <br><br>
            Atau dapat pula digabungkan, menjadi:<br>
            <b><i><u>Tebal miring dan bergaris bawah</u></i></b>
        </p>
    </body>
</html>
Hasil
Hasil

Itulah tag dan elemen-elemen dasar yang ada pada HTML.

Baik, itu saja artikel Tag dan Elemen Dasar HTML yang Saya buat kali ini. Semoga bermanfaat.

Posting Komentar untuk "Tag dan Elemen Dasar HTML"