Belajar | Menghias Tulisan dengan Tag HTML

Pada Latihan kali ini, kita akan mempelajari beberapa tag yang mudah diingat. Tag-tag ini berfungsi untuk mengubah tipe huruf yaitu :
  1. Membuat Text Menjadi Tebal {Bold}
  2. Membuat Text Menjadi Miring {Italic}
  3. Membuat Text Di Garis Bawahi {Underline}
  4. Membuat Text Di Garis Tengah {Strikethrough}
  5. Membuat Text Berada Di Atas {Superscript}
  6. Membuat Text Berada Di Bawah {Subscript}

Cara Penggunaannya

Pertama-tama hafalkan dulu fungsi dan cara penggunaannya. Di Bawah ini saya buat lagi daftar cara penggunaannya.
  1. Membuat Text Menjadi Tebal {<b> atau <strong>}
  2. Membuat Text Menjadi Miring {<i> atau <em>}
  3. Membuat Text Di Garis Bawahi {<u> atau <ins>}
  4. Membuat Text Di Garis Tengah {<del> atau <strike>}
  5. Membuat Text Berada Di Atas {<sup>}
  6. Membuat Text Berada Di Bawah {<sub>}
Hal yang harus kita ingat dari catatan yang sudah saya publish sebelumnya adalah “Kita harus menutup tag HTML dan jika menggunakan XHTML penyusunan awal dan akhir tag harus berurutan”. Contoh sederhananya gini, Misalkan kita mau membuat huruf tebal maka kita harus menulis tag pembuka yakni <strong> dan harus di akhiri dengan tag penutupnya dengan hanya menambahkan slash seperti </strong>. Penyusunan tag harus Rapih jika kita menggunakan XHTML, Contohnya adalah :

Penulisan Yang Salah
<strong>Sepertinya <ins>Belajar HTML</strong> itu Mudah Sekali</ins>
Penulisan Yang Benar
<strong>Sepertinya <ins>Belajar HTML</ins> itu Mudah Sekali</strong>

Contoh Penerapan Dalam Artikel

Oke, Buka Aplikasi Notepad, gEdit, dan semacamnya. Lalu coba ketik secara manual jangan kopi paste kode di bawah ini :

<html>
<head>
<title>Ini Adalah Tulisan Standard</title>
</head>
<body bgcolor="#fcf" text="#000">
Banyak Tag HTML untuk merubah suatu jenis tulisan
dan di antaranya ialah tulisan tebal, tulisan miring,
tulisan bergaris bawah, tulisan bergaris tengah,
tulisan Berada Di Atasdan tulisan Berada Di Atas.
Kita Bisa Membuat 2 tipe huruf dipadukan misalnya tulisan tebal
dan miring, tulisan tebal dan bergaris bawah atau tulisan miring
dan bergaris bawah. Bahkan Kita Juga Bisa Menggabungkan sekaligus
menjadi tulisan bergaris tengah, tulisan tebal, miring dan bergaris bawah.
</body>
</html>
Kemudian simpan tulisan tadi dengan nama tulisan-biasa.html lalu buka dan perhatikanlah tulidan tersebut. Tulisan tersebut masih dalam kondisi yang sama alias tidak ada huruf tebal, miring, dan lain-lain. Disini kita akan coba merubah tulisan tersebut agar di garis bawahi, di tebalkan, dan lain sebagainya.
Buka Notepad Lagi, Lalu Perhatikan Dan Ketikkan Kode yang ada di bawah ini :

<html>
<head>
<title>Ini Adalah Tulisan Modifikasi</title>
</head>
<body bgcolor="#fcf" text="#000">
Banyak Tag <sup>HTML</sup> untuk merubah suatu jenis tulisan dan
di antaranya ialah <strong>tulisan tebal</strong>,
<em>tulisan miring</em>, <ins>tulisan bergaris bawah</ins>,
<del>tulisan bergaris tengah</del>, <sup>tulisan Berada Di Atas</sup>
dan <sub>tulisan Berada Di Atas</sub>.
Kita Bisa Membuat 2 tipe huruf dipadukan misalnya
<strong><em>tulisan tebal dan miring</em></strong>,
<ins><strong>tulisan tebal dan
bergaris bawah</strong></ins> atau
<em><ins>tulisan miring dan bergaris bawah</ins></em>.
Bahkan Kita Juga Bisa Menggabungkan sekaligus
menjadi tulisan <strong><em><del><ins>bergaris tengah,
tulisan tebal, miring dan bergaris bawah</ins></del></em></strong>.
</body>
</html>
Simpan dan Lihatlah Perbedaannya. Anda juga dapat melihat perbedaannya di Halaman Tulisan Standard Dan Halaman Tulisan Modifikasi. Coba anda perhatikan tulisan Output Browsernya dan lihat juga Source Codenya Dengan CTRL + U. Usahakan untuk menggunakan Editor Notepad dan jangan memakai Editor Seperti Macromedia Dreamweaver. Karena jika anda menggunakan Editor Notepad dan menuliskannya secara manual, itu akan membuat anda lebih cepat mengerti tentang Tag HTML.
source


Diposting oleh Unknown Minggu, 20 Juli 2014
Label: