-->

Iklan bawah header

Belajar HTML Part 20 - Mengenal Tag abbr, cite, dfn dan small di HTML

tag abbr, cite, dfn dan small

Pada kesempatan kali ini kita akan membahas mengenai tag <cite>, <abbr>, <dfn&g; dan <small>, tag tersebut memiliki fungsi untuk memanipulasi text di html, sehingga content yang dihasilkan lebih menarik.

Untuk lebih jelasnya, mari langsung saja kita bahas mengenai tag-tag tersebut.

Tag <cite>

Tag cite (Citation) merupakan tag yang digunakan untuk menampilkan teks dengan format referensi, teks yang menggunakan tag <cite> akan ditampilkan dengan menggunakan huruf miring.

Coba kalian lihat contoh skrip html di bawah ini :

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
<h3>Belajar Tag < cite ></h3>
HTML adalah singkatan dari Hypertext markup language, dimana anda harus belajar HTML terlebih dahulu.
Sebelum anda belajar hal lain yang berhubungan dengan pemrogaman web, seperti CSS,PHP,JAVASCRIPT.
Referensi saya untuk belajar HTML adalah di <cite>www.w3schools.com | www.tutorialspoint.com/</cite>
</body>
</html>

Saat dijalankan di browser, maka hasilnya akan seperti ini.

tag cite

Bisa kalian perhatikan gambar diatas, teks yang menggunakan tag <cote> akan ditampilkan dengan huruf miring (italic).

Tag <abbr>

Tag abbr (Abbreviation) digunakan untuk menampilkan singkatan berupa tooltip ketika ada mouse diatas teks yang menggunakan tag ini, tag ini merupakan inline element, jadi akan tetap mengikuti alur di teks yang ada.

Perhatikan contoh dibawah ini.


<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
<h3>Belajar Tag < abbr ></h3>
<abbr title="Hypertext Markup Language">HTML</abbr> adalah dasar dari pemrogaman web yang perlu anda pelajari
untuk membuat website, karena semua website akan menggunakan HTML sebagai dasar dari pemrogamannya.
</body>
</html>

Berikut hasil yang akan ditampilkan saat dijalankan di browser.

tag abbr

Bisa kalian lihat pada gambar diatas, saat mouse diarahkan ke teks HTML maka akan muncul tooltip dengan teks Hypertext Markup Language.

Tag <dfn>

Tag dfn (definition) merupakan tag yang digunakan untuk menampilkan teks definisi, teks yang menggunakan tag dfn akan ditampilkan dengan huruf miring.

Coba perhatikan code html dibawah ini.

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
<h3>Belajar Tag < dfn ></h3>
<dfn>HTML</dfn> adalah bahasa yang harus anda kuasai sebelum belajar di pemrogaman web lain,
karena semua web pasti akan memerlukan HTML sebagai pembuatan element - element web.
<hr/>
<dfn title="Hypertext markup language">HTML</dfn> adalah bahasa yang harus anda kuasai sebelum belajar di pemrogaman web lain,
karena semua web pasti akan memerlukan HTML sebagai pembuatan element - element web.
</body>
</html>

Jika kita jalankan pada browser, hasilnya adalah sebagai berikut.

tag dfn

Tag <small>

Tag small merupakan tag yang digunakan untuk menampilkan teks dengan ukuran yang lebih kecil, sebenarnya tag small sudah berstatus dprecated, hanya saja telah didefinisikan ulang di HTML 5.

Tag <small> bisa kalian gunakan untuk menampilkan teks dengan ukuran yang kecil, seperti untuk teks copyright ataupun legal notice.

Perhatikan skrip html dibawah ini

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML</title>
</head>
<body>
HTML adalah bahasa yang harus anda kuasai terlebih dahulu, sebelum mempelajari bahasa lain,
karena semua website yang ada didunia menggunakan HTML sebagai dasar dari web mereka
<small>Copyright offaweb.com 2020</small>
</body>
</html>

Jika diakses melalui browser, maka hasilnya akan ditampilkan seperti gambar dibawah ini.

tag small

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel