Format Text Pada HTML

Mengatur format text pada HTML, agar konten website lebih menarik

Setelah sebelumnya teman-teman belajar tentang cara mambuat heading dan paragraf pada HTML, pada tutorial ini teman-teman akan belajar tentang format text yang ada pada HTML.

Kita bisa melakukan modifikasi atau mengatur format pada text di HTML sesuai dengan yang kita inginkan. Seperti halnya pada microsoft word.

Format Text Pada HTML

Kita bisa membuat tulisan tebal (bold), tulisan miring (italic), dan lain-lain.

HTML telah menyediakan banyak sekali tag yang bisa kita gunakan untuk mengatur bentuk text.

Membuat Tulisan Tebal (Bold)

Untuk membuat tulisan tebal atau bold dengan HTML, kita bisa menggunakan tag <b> .. </b>. Sehingga kita bisa menonjolkan text tertentu sesuai dengan yang kita inginkan.

Untuk cara penulisan nya diawali dengan tag <b> pembuka dan diakhiri dengan tag </b> penutup.

Kemudian letakkan text yang ingin dibuat tebal di antara tag <b> .. </b>.

Selain tag <b> .. </b>, kita juga bisa menggunakan tag <strong> .. </strong>.

Perhatikan contoh berikut.

<p>Saya belajar HTML dasar di <b>codingan.id</b>.</p>
<p>Ini adalah contoh text <strong>tebal</strong>.</p>  

Jalankan kode ini

Membuat Tulisan Miring (Italic)

Tulisan miring pada HTML bisa ditulis dengan menggunakan tag <i> .. </i>.

Text yang ingin dibuat miring bisa diletakkan di antara tag <i> pembuka dan tag </i> penutup.

Penggunaan tulisan miring ini biasanya digunakan untuk menekankan kata tertentu atau kata dalam bahasa asing.

Selain tag <i> .. </i>, kita juga bisa menggunakan tag <em> .. </em>.

Perhatikan contoh berikut.

<h1>Saya menulis <i>script</i> HTML menggunakan <i>text editor</i>.</h1>
<p>Ini adalah contoh text <em>miring</em>.</p>   

Jalankan kode ini

Membuat Tulisan Bergaris Bawah (Underline)

Untuk membuat tulisan bergaris bawah kita bisa menggunakan tag <u> … </u>.

Kemudian letakkan tulisan yang ingin dibuat miring diantara tag <u> pembuka dan tag </u> penutup.

Perhatikan contoh berikut.

<h1>Saya menulis <i>script</i> HTML menggunakan <i>text editor</i>.</h1>
<p>Ini adalah contoh text <em>miring</em>.</p>

Jalankan kode ini

Kesimpulan

Format text pada HTML bertujuan untuk membuat konten text pada website lebih menarik dan informatif.

Kamu dapat mengatur bentuk tulisan dengan tag <i> .. </i> jika ingin membuat tulisan miring. gunakan tag <u> .. </u> untuk membuat miring dan gunakan tag <b> … </b> untuk membuat tulisan tebal.

Cukup mudah kan. yuk lanjut ke tutorial HTML selanjutnya. Pada tutorial HTML selanjutnya kita akan belajar tentang cara menampilkan gambar pada halaman website dengan HTML.