.jpeg)
Pada artikel sebelumnya, kita sudah membahas pengenalan html. Sekarang kita akan melanjutkan materi yang kemarin. Dalam artikel ini, kita akan membahas tentang pemformatan teks dalam html.
Pemformatan teks memiliki jenisnya, misalnya teks tebal, teks miring, teks garis bawah, teks berwarna, teks superscript, teks suberscript, dan teks yang memiliki background berwarna. Bagaimana sih cara membuatnya ? Yukk kita pelajari bersama dibawah ini
1. Teks Paragraf Html
Dalam Html, kita bisa membuat sebuah paragraf. Untuk membuat sebuah paragraf, kita bisa menggunakan tag <p> dengan penutup tag nya </p>. Contoh membuat paragraf menggunakan tag <p> seperti kodingan dibawah ini
<!DOCTYPE html>
<html>
<head>
<title> Contoh Paragraf dalam Html </title>
</head>
<body>
<p> Selamat Datang di Blog Freeze Gans </p>
</body>
</html>
Selamat Datang di Blog Freeze Gans
2. Enter dalam Html Dalam html, kita bisa membuat enter atau barisan baru. Untuk membuat enter dalam html, kita bisa menggunakan tag <br>. Berikut ini adalah contoh kodingan membuat barisan baru menggunakan tag <br>.
<!DOCTYPE html>
<html>
<head>
<title> Contoh Enter dalam Html </title>
</head>
<body>
<p>
Teks Ini Merupakan Barisan Pertama
<br>
Teks Ini Merupakan Barisan Kedua
<br>
Teks Ini Merupakan Barisan Ketiga
<br>
Teks Ini Merupakan Barisan Keempat
<br>
Teks Ini Merupakan Barisan Kelima
</p>
</body>
</html>Teks Ini Merupakan Barisan Pertama
Teks Ini Merupakan Barisan Kedua
Teks Ini Merupakan Barisan Ketiga
Teks Ini Merupakan Barisan Keempat
Teks Ini Merupakan Barisan Kelima
3. Garis dalam Html
Kita bisa membuat garis dalam html dengan tag <hr>. Fungsi dari garis adalah untuk memisahkan bagian bagian tertentu. Berikut ini adalah contoh codingan nya
<!DOCTYPE html>
<html>
<head>
<title> Contoh Garis dalam Html </title>
</head>
<body>
<hr>
<p> Selamat Datang di Blog Freeze Gans </p>
<hr>
<p> Selamat Datang di Blog Freeze Gans </p>
<hr>
</body>
</html>
3. Heading dalam Html
Untuk membuat heading dalam html, kita bisa menggunakan tag <h1> sampai tag <h6>. Tag pertama adalah <h1>, <h2>, <h3>, <h4>, <h5>, dan terakhir <h6>.
- <h1> : heading level 1 yang ukuran nya 200% dari ukuran normal
- <h2> : heading level 2 yang ukuran nya 150% dari ukuran normal
- <h3> : heading level 3 yang ukuran nya 117% dari ukuran normal
- <h4> : heading level 4 yang ukuran nya 100% dari ukuran normal
- <h5> : heading level 5 yang ukuran nya 83% dari ukuran normal
- <h6> : heading level 6 yang ukuran nya 67% dari ukuran normal
<!DOCTYPE html>
<html>
<head>
<title> Contoh Heading dalam Html </title>
</head>
<body>
<h1> Ini adalah heading pertama </h1>
<h2> Ini adalah heading kedua </h2>
<h3> Ini adalah heading ketiga </h3>
<h4> Ini adalah heading keempat </h4>
<h5> Ini adalah heading kelima </h5>
<h6> Ini adalah heading keenam </h6>
</body>
</html>
4. Teks Tebal dalam Html
Dalam html, kita bisa membuat teks tebal menggunakan tag <b>. Selain menggunakan tag <b>, kita juga bisa menggunakan tag <strong>. Berikut ini adalah contoh codingan nya
<!DOCTYPE html>
<html>
<head>
<title> Contoh Teks Tebal dalam Html </title>
</head>
<body>
<b> Selamat Datang di Blog Freeze Gans </b>
<br>
<strong> Selamat Datang di Blog Freeze Gans </strong>
</body>
</html>
Selamat Datang di Blog Freeze Gans
Selamat Datang di Blog Freeze Gans
Namun meskipun tag <br> dengan tag <strong> memiliki fungsi yang sama yaitu membuat teks menjadi tebal, terdapat juga perbedaanya. Perbedaan nya adalah tag <b> yaitu bold yang berarti digunakan hanya sekedar menebalkan teks, sedangkan tag <strong> memiliki fungsi untuk menunjukkan bahwa teks tersebut penting dibandingkan teks lainnya.
Artikel Menarik Lainnya :
5. Teks Miring dalam Html
Dalam html, kita bisa membuat tulisan miring. Untuk menggunakan tulisan miring, kita bisa menggunakan tag <i> dan <em>. Berikut ini adalah contoh codingan nya
<!DOCTYPE html>
<html>
<head>
<title> Contoh Teks Miring dalam Html </title>
</head>
<body>
<i> Selamat Datang di Blog Freeze Gans </i>
<br>
<em> Selamat Datang di Blog Freeze Gans </em>
</body>
</html>
Selamat Datang di Blog Freeze Gans
Selamat Datang di Blog Freeze Gans
Meskipun tag <i> dan tag <em> memiliki fungsi yang sama yaitu membuat tulisan menjadi miring, namun ada juga perbedaan nya. Perbedaan tag <i> dan tag <em> adalah tag <i> merupakan italic yang berarti untuk membuat teks menjadi mirin, sedangkan tag <em> dari kata emphasis yang digunakan untuk penekanan terhadap teks tertentu (stress emphasis).
6. Teks Garis Bawah dalam Html
Dalam html, kita bisa membuat teks yang memiliki garis bawah. Untuk membuat teks bergaris bawah, kita bisa membuatnya dengan tag <u> dan tag <ins>. Berikut ini adalah contoh codingannya
<!DOCTYPE html>
<html>
<head>
<title> Contoh Teks Garis Bawah dalam Html </title>
</head>
<body>
<u> Selamat Datang di Blog Freeze Gans </u>
<br>
<ins> Selamat Datang di Blog Freeze Gans </ins>
</body>
</html>
Selamat Datang di Blog Freeze Gans
Selamat Datang di Blog Freeze Gans
Meskipun tag <u> dan tag <ins> memiliki fungsi yang sama, tetapi terdapat juga perbedaan nya. Tag <u> berasal dari kata underline yang berarti garis bawah, sedangkan tag <ins> berasal dari kata insert digunakan untuk membuat teks garis bawah dengan tujuan menunjukkan bahwa teks tersebut baru saja ditambahkan.
7. Teks Coret dalam Html
Dalam html, kita bisa membuat teks yang dicoret dengan garis. Untuk membuatnya, kita bisa menggunakan tag <s> dan tag <del>. Berikut ini adalah contoh codingan nya.
<!DOCTYPE html>
<html>
<head>
<title> Contoh Teks Garis Bawah dalam Html </title>
</head>
<body>
<s> Selamat Datang di Blog Freeze Gans </s>
<br>
<del> Selamat Datang di Blog Freeze Gans </del>
</body>
</html>
Namun meskipun tag <s> dan tag <del> memiliki fungsi yang sama, terdapat juga perbedaan nya. Tag <s> berasal dari kata strikethrough yang fungsinya hanya untuk mencoret teks tanpa tujuan apapun, sedangkan tag <del> dari kata delete yang mendefinisikan bahwa teks tersebut tidak berlaku lagi
8. Teks Superscript dalam Html
Teks Superscript merupakan teks kecil yang yang berada diatas, contohnya adalah seperti pangkat dalam pelajaran matematika. Untuk membuat teks superscript, kita bisa menggunakan tag <sup> beserta penutupnya </sup>. Contoh codingan nya seperti dibawah ini.
<!DOCTYPE html>
<html>
<head>
<title> Contoh Superscript dalam Html </title>
</head>
<body>
<p> Selamat Datang di <sup> Blog Freeze Gans </sup></p>
</body>
</html>
Selamat Datang di Blog Freeze Gans
9. Teks Suberscript dalam Html Teks Suberscript merupakan kebalikan dari Teks Superscript. Jika superscript adalah teks kecil yang berada diatas, maka suberscript adalah teks kecil yang berada dibawah. Biasanya teks suberscript digunakan dalam pelajaran kimia. Untuk membuat teks suberscript, kita bisa menggunakan tag <sub> dengan tag penutupnya </sub>. Berikut ini adalah contoh codingan nya
<!DOCTYPE html>
<html>
<head>
<title> Contoh Subercript dalam Html </title>
</head>
<body>
<p> Selamat Datang di <sub> Blog Freeze Gans </sub></p>
</body>
</html>
Selamat Datang di Blog Freeze Gans