Belajar HTML : HTML Text Formatting – Bagian IX

Diposting pada
Belajar HTML : HTML Text Formatting - Bagian IX

 Jika sebelumnya kita mempelajari mengenai atribut style pada HTML, kali ini kita akan belajar mengenai Text Formatting pada HTML.

HTML memiliki beberapa elemen untuk mendefinisikan teks dengan arti khusus menggunakan format tertentu. Sebagai contoh.

Elemen <b> akan menghasilkan teks Cetak Tebal.
Elemen <i> akan menghasilkan teks Italic.

Elemen Pemformatan pada HTML

Beberapa elemen performatan pada HTML dirancang untuk menampilkan jenis teks dengan arti khusus, yaitu :
<b> – Teks Cetak Tebal.
<strong> – Teks Penting ( Sama Seperti Bold ).
<i> – Teks Italic atau Miring.
<em> – Teks yang Emphasize ( Sama seperti Italic ).
<mark> – Teks Penanda.
<small> – Teks Ukuran Kecil.
<del> – Teks yang dihapus.
<ins> – Teks yang disisipkan.
<sub> – Teks subskrip ( Teks cetak kecil dibawah ).
<sup> – Teks Superskrip ( Teks cetak kecil diatas ).

Elemen <b> dan <strong> pada HTML

Elemen <b> dan <strong> memang memiliki bentuk yang sama, namun memiliki perbedaan.
Elemen <b> digunakan untuk mendefinisikan teks cetak Tebal, namun bukan teks penting.
<b>Ini hanyalah teks cetak tebal biasa</b>

See the Pen IDNCODER – Format Bold by Rahman (@rahmannur19) on CodePen.

Sedangkan Elemen <strong> digunakan untuk mendefinisikan teks cetak tebal yang sangat penting. Biasanya digunakan dalam Teks yang mengandung arti yang sangat penting.
<strong>Ini teks cetak tebal yang sangat penting!</strong>

See the Pen IDNCODER – Format Strong by Rahman (@rahmannur19) on CodePen.

Elemen <i> dan <em> pada HTML

Elemen <i> pada HTML Mendefinisikan bagian teks dengan Suara atau Suasana hati alternatif. Konten yang ada didalam elemen <i>…</i> akan ditampilkan dalam huruf Italic atau Miring.
Tip: Elemen <i> biasanya digunakan untuk menunjukkan istilah teknis sebuah frase dari bahasa lain, pikiran, nama kapal, dll.
<i> Teks ini adalah Italic</i>

See the Pen IDNCODER – Format Italic by Rahman (@rahmannur19) on CodePen.

Elemen <em> pada HTML, mendefinisikan teks yang memiliki arti penting, dan akan menampilkan teks yang sama seperti Italic atau Miring.
<em> Teks ini adalah Emphasized </em>

See the Pen IDNCODER – Format Emphasized by Rahman (@rahmannur19) on CodePen.

Elemen <small> pada HTML

Elemen <small> mendefinisikan teks berukuran lebih kecil, 
<small> Teks berukuran kecil</small>

See the Pen IDNCODER – Format Small by Rahman (@rahmannur19) on CodePen.

Elemen <mark> pada HTML

Elemen <mark> pada HTML mendifinisikan teks yang diberi tanda atau disorot.
<p>Ini adalah Teks yang diberi <mark>Penanda atau Highlight</mark></p>

See the Pen IDNCODER – Format Mark by Rahman (@rahmannur19) on CodePen.

Elemen <del> pada HTML

Elemen <del> digunakan untuk mendefinisikan teks yang telah dihapus. Browser biasanya akan membuat teks yang didalam elemen tersebut tercoret.
<p>Harga susu ini hanya <del>Rp.5.000</del> Rp.2.000</p>

See the Pen IDNCODER – Format Del by Rahman (@rahmannur19) on CodePen.

Elemen <ins> pada HTML

Elemen <ins> mendefinisikan teks yang telah disisipkan kedalam dokumen. Browser biasanya akan menampilkan dengan teks yang diberi garis bawah.
<p>Harga susu ini sangat murah <ins>Rp.2.000</ins></p>

See the Pen IDNCODER – Format Ins by Rahman (@rahmannur19) on CodePen.

Elemen <sub> dan <sup> pada HTML

Elemen <sub> pada HTML mendefinisikan teks Subskrip atau teks yang berukuran kecil berada dibawah seperti halnya Rumus Kimia yaitu H 2 O.
<p>Ini adalah teks <sub>subscripted</sub></p>

See the Pen IDNCODER – Format Subscripted by Rahman (@rahmannur19) on CodePen.

Sedangkan Elemen <sup> pada HTML mendenisikan teks Superskrip atau teks yang berukuran kecil berada diatas seperti pangkat di Matematika ataupun Kimia yaitu 53.
<p>Ini adalah  teks <sup>superscripted</sup></p>

See the Pen IDNCODER – Format Superscripted by Rahman (@rahmannur19) on CodePen.

Nah mungkin itu saja yang dapat saya posting mengenai Format Text yang ada di HTML, dan terimakasih sudah membaca hingga selesai, dan tunggu postingan belajar HTML berikutnya 😀

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *