Penakode - Pembahasan kali ini kita akan membahas tentang cara menggunakan format teks di HTML.

Ada beberapa elemen yang digunakan pada HTML untuk melakukan format teks pada HTML seperti mencetak tebal teks, garis miring, dan lain-lain.

Format Elemen HTML

Elemen-elemen yang sering digunakan pada format teks yaitu:

  • Bold text (tag <b>)
  • Important text (tag <strong>)
  • Italic text (tag <i>)
  • Emphasized text (tag <em>)
  • Underline text (tag <u>)
  • Marked text (tag <mark>)
  • Small text (tag <small>)
  • Deleted text (tag <del>)
  • Inserted text (tag <ins>)
  • Subscripts (tag <sub>)
  • Superscripts (tag <sup>)

Format Bold dan Strong

Format Bold (tag <b>)

Elemen HTML yang digunakan untuk mencetak tebal pada teks adalah tag <b>. Penggunaan elemen bold hanya mencetak tebal pada teks.

Contoh penggunaan:

<p>Ini contoh teks biasa</p>

<p>Ini contoh <b>teks tebal</b></p>

Hasilnya menjadi:

Ini contoh teks biasa

Ini contoh teks tebal

Format Strong (tag <strong>)

Selain menggunakan tag <b>, elemen HTML lain yang digunakan untuk mencetak tebal pada teks adalah tag <strong>. Penggunaan elemen Strong akan mencetak tebal pada teks dengan penekanan penting.

Contoh penggunaan:

<p>Ini contoh teks biasa</p>

<p>Ini contoh <strong>teks tebal</strong></p>

Hasilnya menjadi:

Ini contoh teks biasa

Ini contoh teks tebal

Format Garis Miring / Italic

Untuk membuat format garis miring pada teks harus menggunakan tag <i> (format italic).

Contoh penggunaan:

<p>Ini contoh teks biasa</p>

<p>Ini contoh <i>teks miring</i></p>

Hasilnya menjadi:

Ini contoh teks biasa

Ini contoh teks miring

Format Emphasized

Untuk membuat format garis miring dengan penekanan penting pada teks harus menggunakan tag <em> (format emphasized).

Contoh penggunaan:

<p>Ini contoh teks biasa</p>

<p>Ini contoh <em>teks miring</em></p>

Hasilnya menjadi:

Ini contoh teks biasa

Ini contoh teks miring

Format Underline

Untuk membuat format underline atau garis bawah pada teks harus menggunakan tag <u> (format underline).

Contoh penggunaan:

<p>Ini contoh teks biasa</p>

<p>Ini contoh <u>teks underline</u></p>

Hasilnya menjadi:

Ini contoh teks biasa

Ini contoh teks underline

Format Marked

Untuk membuat format highlighted text pada HTML harus menggunakan tag <mark> (format marked).

Contoh penggunaan:

<p>Ini contoh <mark>marked text</mark></p>

Hasilnya menjadi:

Ini contoh marked text

Format Small Text (Kecil)

Untuk membuat format Small text pada HTML harus menggunakan tag <small> (format small).

Contoh penggunaan:

<p>Ini contoh <small>Small text</small></p>

Hasilnya menjadi:

Ini contoh Small text

Format Deleted Text

Untuk membuat format Deleted text pada HTML harus menggunakan tag <del> (format delete).

Contoh penggunaan:

<p>Ini contoh <del>Deleted text</del></p>

Hasilnya menjadi:

Ini contoh Deleted text

Format Inserted Text

Untuk membuat format Inserted text pada HTML harus menggunakan tag <ins> (format insert).

Contoh penggunaan:

<p>Ini contoh <ins>Inserted text</ins></p>

Hasilnya menjadi:

Ini contoh Inserted text

Format Subscript Text

Untuk membuat format Subscript text pada HTML harus menggunakan tag <sub> (format subscript).

Format subscript yang sering digunakan pada contoh penulisan rumus kimia pada air contohnya: H2O.

Contoh penggunaan:

<p>Ini contoh <sub>Subscript text</sub></p>

Hasilnya menjadi:

Ini contoh Subscript text

Format Superscript Text

Untuk membuat format Superscript text pada HTML harus menggunakan tag <sup> (format superscript).

Format superscript yang sering digunakan pada contoh penulisan pangkat rumus matematika misalnya: X2.

Contoh penggunaan:

<p>Ini contoh <sup>Superscript text</sup></p>

Hasilnya menjadi:

Ini contoh Superscript text

Mudahkan membuat format teks pada HTML ?

Ingat, yang terpenting dari pelajaran dasar HTML ini adalah selalu mencoba dan memulai menerapkan apa yang sudah dipelajari.

Format Teks pada HTML ini adalah yang paling sering digunakan dalam memodifikasi teks pada halaman HTML. Jadi belajar HTML dasar bagi pemula akan sangat membantu dalam membangun sebuah website.

Apabila kamu sudah bisa menguasai dasar-dasar HTML maka kamu akan lebih mudah untuk membuat website dari nol baik menggunakan framework maupun tidak. Salah satu cara membuat blog atau website adalah menggunakan framework static site generator dari hugo.

Setelah belajar dasar-dasar HTML, kamu tidak hanya dapat membuat sebuah blog atau website tetapi juga membuat aplikasi berbasis web.

Referensi jika kamu ingin membuat blog yang dibangun menggunakan static site generator:

  1. Cara Membuat Blog Dengan Hugo Bagian 1
  2. Cara Membuat Blog Dengan Hugo Bagian 2 (Deploy hugo ke github pages)
  3. Langkah Mudah Deploy Hugo Ke Netlify