Cara Membuat Huruf Garis Bawah (underline) HTML (tag u dan tag ins)

Penulisan text dengan garis bawah atau underline biasa digunakan untuk menandai kata atau penekanan kata yang dianggap penting. Untuk membuat karakter dengan garis bawah di dalam HTML, kita menggunakan tag  dan tag <ins>.

Dalam tutorial kali ini, kita akan mempelajari Cara Membuat Huruf Garis Bawah (underline) dalam HTML dengan menggunakan tag dan tag <ins>.

Tag untuk Penulisan Text dengan Garis Bawah

Tag  adalah singkatan dari underline, atau garis bawah. Tag ini digunakan untuk membuat karakter text dengan garis bawah. Sama seperti tag  dan , tag  tidak memiliki tujuan apa-apa dan lebih kepada tampilan dari text.

Tag  masuk kedalam tipe tag inline, yang akan mengikuti alur text yang ada.

Berikut adalah contoh cara penulisan dan penggunaan tag  di dalam HTML:

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML di Duniailkom</title>
</head>

<body>
<h3>Saya sedang belajar HTML di Duniailkom.com</h3>
<p><u>HTML</u> atau <u>Hypertext Markup Language</u> 
adalah dasar dari semua halaman web di internet. 
Jika anda ingin mempelajari cara membuat website,
maka hal pertama yang harus dipelajari adalah HTML</p>
</body>

</html>

Tag <ins> untuk Penulisan Text dengan Garis Bawah

Tag <ins> adalah kependekan dari Insert. Tag <ins> ditujukan untuk bagian text baru yang ditambahkan ke dalam konten web. Tag <ins> dirancang untuk menegaskan bagian text yang sebelumnya tidak ada. Tag ini adalah kebalikan dari tag <del>.

Tag <ins> saya masukkan ke dalam tutorial ini karena secara default web browser menampilkan tag <ins> dengan garis bawah. Tag ini termasuk jenis inline element.

Berikut adalah contoh penggunaan tag <ins> di dalam HTML:

<!DOCTYPE html>
<html>
<head>
<title>Belajar HTML di Duniailkom</title>
</head>

<body>
<h3>Saya sedang belajar HTML di Duniailkom.com</h3>
<p>HTML atau Hypertext Markup Language adalah dasar dari
semua halaman web di internet. Jika anda ingin mempelajari 
cara membuat website, maka 
<del>hal pertama yang harus dipelajari adalah PHP</del>
<ins>hal pertama yang harus dipelajari adalah HTML</ins></p>
</body>

</html>

Secara pribadi, saya menggunakan tag  untuk bagian text yang tidak ditujukan apa-apa selain mempertegas penulisan. Namun apabila ada bagian text yang ditambahkan kemudian, tag <ins> akan membantu struktur konten dari HTML.

Untuk membuat hasil huruf dengan garis bawah di dalam CSS, kita bisa menggunakan:

text-decoration: underline;

Zulmy Eve
08 Jan 16

wah makasih ya om :)

Andre
10 Feb 16

Sama2, semoga bermanfaat :)

james herbs
08 Feb 16

terima kasih ya om atas penjelasannya sangat bermanfaat maklum nubie

Andre
10 Feb 16

Siip mas… lanjutkan belajar HTMLnya :)

Baey
06 Oct 16

Jika dalam kata tersebut ingjn di italic, bold, Dan underline, pengkodingannya seperti apa.?

Andre
06 Oct 16

Jika satu kata ingin italic, bold, dan underline sekaligus, tinggal digabung saja gan, seperti ini:

Belajar HTML/b>
Muhammad Jaeni
24 Jun 17

Kalau underscore ( _ ) emang ada kode html nya ya?

Andre
28 Jun 17

Untuk karakter underscore, tinggal ditulis saja dari keyboard, tidak perlu pakai kode HTML apapun.

W3am4
03 Sep 17

hi admin, Mau nanya nih selain kode underline dan <ins></ins> ada lagi nggak yang mirip dengan kode itu?
saya sudah coba tetapi tidak work!!!

Andre
05 Sep 17

Cobanya dimana y? kalau di blogspot, bisa jadi ada aturan khusus yang mencegah menginput kode HTML. Atau kalau di kolom komentar sebuah blog, bisa jadi memang tidak dibolehkan (atas alasan keamanan), contohnya kolom komentar di web duniailkom ini juga tidak bisa menerima kode HTML apapun, karena memang saya set seperti itu.

Tag dan <ins></ins> hanya bisa diterapkan di dalam file HTML standar.