Materi HTML : Tag Efek pada Teks di HTML


  1. Membuat Teks Menjadi Miring (italic)
  2. Membuat Teks Menjadi Tebal (<b>Bold</b>)
  3. Menggunakan Tag <code> untuk Penekanan Sebuah Teks
  4. Membuat Garis Bawah pada Teks di HTML
  5. Cara Membuat Teks Tercoret pada HTML



Setelah melalui beberapa artikel awal di AE-Ducation, kali ini kami akan memberikan sebuah artikel yang sedikit panjang ini untuk menjelaskan berbagai Tag yang dapat anda gunakan untuk memperindah tulisan yang anda buat pada HTML. Berbagai macam Tag tersebut terkadang diperlukan untuk tulisan secara khusus mejelaskan berbedaan dengan teks lainnya. Berikut kami telah merangkumnya sejelas jelasnya.

Membuat Teks Menjadi Miring (italic)

Pada HTML secara khusus menyediakan Tag yang berguna untuk memberikan efek pada teks pada HTML menjadi miring. Terdapat dua Tag yang memiliki kegunaan yang sama yaitu membuat teks menjadi miring atau italic, yaitu Tag <em> dan Tag <i>. Berikut Contoh dalam penggunaan kedua Tag Tersebut :

<!DOCTYPE html>
<html>
<body>
<head>
<title>AE-Ducation Tutorial HTML</title>
</head>

<h2>Penggunaan Tag Inline</h2>
<p><i>HTML telah menyediakan cara khusus untuk memberikan jarak pada sebuah paragraf atau kalimat dengan menggunakan Tag Break ini misalnya</i></p>
<br>
<h2>Penggunaan Tag Emphasis</h2>
<p><em>Anda dapat melihat contoh ini agar lebih mudah dalam belajar HTML pada materi ini</em></p>
<br>

</body>
</html>


Anda dapat memakai satu di antara Tag tersebut yang dapat anda gunakan untuk menekankan suatu kata atau kalimat dengan membuat efek miring. Pada dasarnya kegunaan ini membuat pembaca mencadi tau bahwa kalimat atau kata tersebut adalah kata penting.


Membuat Teks Menjadi Tebal (Bold)

Untuk membuat kata atau kalimat menjadi tebal kita cukup memasukkan kalimat tersebut ke Tag <b> atau <strong>.. Sama seperti cara kita memakai Tag Italic yang memiliki dua Tag yang berfungsi sama, pada Efek Tebal ini juga memiliki dua Tag yang dapat membuat teks yang kita buat menjadi Tabal, yaitu Tag <b> atau <strong>. Berikut cara pengunaannya :


<!DOCTYPE html>
<html>
<body>
<head>
<title>AE-Ducation Tutorial HTML</title>
</head>

<p><strong>Penggunaan Tag Inline</strong></p>

<p><b>HTML</b> telah menyediakan cara khusus untuk memberikan jarak pada sebuah paragraf atau kalimat dengan menggunakan Tag Break ini misalnya</p>
<br>

</body>
</html>






Menggunakan Tag <code> untuk Penekanan Sebuah Teks

Ebelum ke artikel ini anda telah membaca Membuat Paragraf pada HTML,  pada artikel tersebut telah dijelaskan beragam materi namun pada kita berfokus berkaitan Tag <code> ini yaitu Tag <pre>. Tak jauh berbeda dengan Tag <pre> fungsinya untuk kedua Tag tersebut hampir sama, namun pada kegunaannya Tag <pre> berfokus pada paragraf ini sangatlah cocok sedangkan untuk Tag <code> ini sangat cocok untuk sebuah penekanan pada sebuah kata atau kalimat. Mengapa ??

Pada Tag <code> ini teks diperlakukan tak bebas sehingga cocok digunakan untuk penekanan sebuah kalimat. Pada Tag <code> ini semua teks yang terdapat di dalamnya sudah diatur jarak atau spasi pada teks tersebut yaitu satu saja, jadi apabila anda menggunakan spasi ganda pada pemisah kata maka secara otomatis web browser akan membaaca satu saja. Berikut contoh penggunaan Tag <code> ini.


<!DOCTYPE html>
<html>
<body>
<head>
<title>AE-Ducation Tutorial HTML</title>
</head>

<p><strong>Penggunaan Tag Code</strong></p>

<p>HTML telah menyediakan cara khusus untuk memberikan jarak pada sebuah paragraf atau kalimat dengan menggunakan<code> Tag Break     ini misalnya</code></p>
<br>

</body>
</html>




Membuat Garis Bawah pada Teks di HTML

Bagi anda yang membutuhkan garis bawah dalam penulisan pada HTML, telah menyediakan 2 Tag yang cara kerjanya dan fungsinya sama. Anda bisa menggunakan Tag <ins> dan Tag <u> apabila anda ingin memberikan garis bawah pada teks, berikut cara penggunaannya :


<!DOCTYPE html>
<html>
<body>
<head>
<title>AE-Ducation Tutorial HTML</title>
</head>

<h2><p><ins>Cara Membuat Garis di Bawah Teks HTML</ins></p></h2>

<p>HTML telah menyediakan cara khusus untuk memberikan garis bawah pada sebuah paragraf atau kalimat dengan menggunakan <u>Tag ins dan u</u></p>
<br>

</body>
</html>




Cara Membuat Teks Tercoret pada HTML

Untuk membuat teks menjadi tercoret HTML telah menyediakan Tag khusus yang dapat anda gunakan untuk membuat teks menjadi tercoret. Tag <s> dan Tag <del> adalah Tag khusus untuk anda yang ingin membuat tulisan tercoret. Berikut contoh penggunaan Tag <s> dan Tag <del>.


<!DOCTYPE html>
<html>
<body>
<head>
<title>AE-Ducation Tutorial HTML</title>
</head>

<h2><p><s>Belajar Teks Tercoret</s></p></h2>

<p><del>HTML telah menyediakan cara khusus untuk memberikan garis bawah pada sebuah paragraf atau kalimat</del></p>
<br>

</body>
</html>

Selesai juga materi pada artikel ini, apabila anda belum memahaminya anda bisa membaca dari atas ke bawah lagi dengan teliti agar lebih bisa memahami. Jika sudah anda dapat melanjutkan ke artikel selanjutnya.

Materi selanjutnya kami akan melanjutkan pada Teks HTML yang menjelaskan efek pada HTML, Ikuti terus AE-Ducation.

Subscribe to receive free email updates:

1 Response to "Materi HTML : Tag Efek pada Teks di HTML "

  1. Bermanfaat sekali. Saya dulu pernah belajar pemrograman web seperti html, css Dan dulu saya mahir banget kalo masalah html ama css. Tapi semenjak 1,5 tahun gx belajar lagi akhirnya lupa. Terimakasih admin bisa untuk belajar nih

    BalasHapus