Formatting Teks
Tag Format Teks di HTML
HTML memiliki berbagai tag khusus untuk memberikan gaya, makna, atau penekanan pada teks tanpa harus menggunakan CSS.
1. Penekanan & Cetak Tebal / Miring
| Tag | Fungsi | Makna Semantik |
|---|---|---|
<b> |
Cetak tebal (Bold) | Hanya tampilan visual tanpa penekanan khusus |
<strong> |
Cetak tebal + Penting | Menunjukkan bahwa kata/kalimat ini sangat penting |
<i> |
Cetak miring (Italic) | Digunakan untuk istilah asing, judul buku, dsb. |
<em> |
Cetak miring + Penekanan | Menunjukkan penekanan (Emphasis) saat dibaca |
Contoh:
<p>Ini adalah kata <b>tebal biasa</b> dan ini kata <strong>sangat penting</strong>.</p>
<p>Ini adalah kata <i>italic biasa</i> dan ini kata <em>dengan penekanan</em>.</p>
2. Text Highlighting, Small, Superscript & Subscript
<!-- Tag <mark> untuk menyorot teks (stabilo kuning) -->
<p>Jangan lupa membawa <mark>kartu identitas</mark> saat ujian.</p>
<!-- Tag <small> untuk teks berukuran kecil (misal: footnote / copyright) -->
<p><small>© 2026 Hak Cipta Dilindungi Undang-Undang.</small></p>
<!-- Tag <sub> untuk teks subscript (bawah) -->
<p>Rumus air adalah H<sub>2</sub>O.</p>
<!-- Tag <sup> untuk teks superscript (atas) -->
<p>Persamaan kuadrat: x<sup>2</sup> + y<sup>2</sup> = z<sup>2</sup>.</p>
3. Coret Teks (<del> & <ins>)
Tag <del> digunakan untuk menandai teks yang dihapus/direvisi, sedangkan <ins> untuk teks baru yang disisipkan.
<p>Harga promo: <del>Rp 150.000</del> <ins>Rp 99.000</ins>!</p>
4. Kutipan (<blockquote> & <q>)
-
<blockquote>: Digunakan untuk kutipan panjang (blok kutipan). -
<q>: Digunakan untuk kutipan pendek di dalam baris kalimat (inline).
<p>Bung Karno pernah berkata:</p>
<blockquote cite="https://id.wikipedia.org">
"Beri aku 1.000 orang tua, niscaya akan kucabut semeru dari akarnya. Beri aku 10 pemuda niscaya akan kuguncangkan dunia."
</blockquote>
<p>Albert Einstein pernah berujar: <q>Imajinasi lebih penting daripada pengetahuan.</q></p>
5. Kode Komputer (<code> & <pre>)
-
<code>: Menampilkan potongan kode secara inline (font monospace). -
<pre>: Menampilkan teks sesuai format aslinya (mempertahankan spasi dan ganti baris).
<p>Gunakan perintah <code>console.log()</code> untuk menampilkan output di JS.</p>
<pre>
function hello() {
console.log("Hello World!");
}
</pre>