Memformat Teks pada HTML

Pada materi kali ini, kita akan fokus pada beberapa elemen-elemen HTML yang isinya berupa teks (selain gambar, video, audio dan sebagainya) dan cara memformat beberapa teks tersebut. Mari kita mulai dengan menuliskan kode di bawah ini.

<!DOCTYPE html>
<html>
<head>
    <title>Contoh Elemen Format HTML</title>
</head>
<body>
    <h1>Contoh Penggunaan Elemen Format</h1>
    
    <p>
        Ini adalah <em>teks miring</em>, <strong>teks tebal</strong>, <u>teks dengan garis bawah</u>, dan <s>teks yang dicoreng</s>.
    </p>
    
    <p>
        Sekarang, mari kita coba elemen <small>teks kecil</small> untuk mengurangi ukuran teks.
    </p>
</body>
</html>

Dalam contoh di atas, kita menggunakan elemen-elemen berikut:

  • <em> digunakan untuk membuat teks miring (italic).

  • <strong> digunakan untuk membuat teks menjadi tebal (bold).

  • <u> digunakan untuk menambahkan garis bawah pada teks (underline).

  • <s> digunakan untuk mencoreng (strikethrough) teks.

  • <small> digunakan untuk mengurangi ukuran teks.

Masing-masing tag tersebut dalam dikombinasikan dengan tag HTML lainnya dan memberikan format pada beberapa bagian spesifik pada elemen tersebut. Sekarang, teman-teman dapat mencoba membuat sebuah halaman web berisi artikel mengenai beberapa hobi dan kegiatan yang kalian sering lakukan sepulang sekolah. Jangan lupa terapkan beberapa tag untuk memformat teks seperti di atas ya. Misalnya seperti kode berikut ini.

<!DOCTYPE html>
<html>
<head>
    <title>Artikel Hobi</title>
</head>
<body>
    <h1>Hobi-Hobi Saya</h1>
    
    <h2>Hobi 1: Berkebun</h2>
    <p>
        Berkebun adalah salah satu hobi yang sangat <em>memuaskan</em> dan <strong>menyenangkan</strong>. Saya menikmati melihat tanaman-tanaman saya <u>berkembang</u> dan <u>menghasilkan buah</u>. Meskipun saya pernah mengalami <s>tanaman yang mati</s>, itu adalah bagian dari proses pembelajaran.
    </p>
    
    <h2>Hobi 2: Membaca Buku</h2>
    <p>
        Membaca adalah hobi yang membuat saya <strong>terinspirasi</strong> dan <em>terhibur</em>. Ketika saya membaca, saya merasa seolah-olah saya <u>terbawa</u> ke dunia yang berbeda. Saya suka mengeksplorasi berbagai <small>genre buku</small> dari fiksi hingga non-fiksi.
    </p>
    
    <h2>Hobi 3: Bersepeda</h2>
    <p>
        Bersepeda adalah cara yang bagus untuk <em>menjaga kebugaran</em> dan <em>menjelajahi alam</em>. Saya sering bersepeda di taman atau jalur sepeda yang indah. Ini juga merupakan kesempatan yang baik untuk <strong>menyegarkan pikiran</strong>.
    </p>
    
    <h2>Hobi 4: Memasak</h2>
    <p>
        Memasak adalah hobi yang memungkinkan saya <em>berkreasi di dapur</em>. Saya senang mencoba <small>resepi-resepi baru</small> dan berbagi hidangan dengan teman dan keluarga. Dalam memasak, saya juga belajar tentang <s>kesabaran</s> dan <s>ketelitian</s>.
    </p>
</body>
</html>

Perlu diingat bahwa coding itu bukan menghafal, tapi memahami. Jangan takut untuk mencoba, maka kalian akan terbiasa!

Referensi

https://www.w3schools.com/html/html_formatting.asp

Last updated