Mengenal Beragam Format Text Pada HTML

Ada berbagai macam Format Text pada HTML, Dan memiliki fungsi yang berbeda-beda. Format Text ini digunakan untuk memodifikasi suatu tulisan pada halaman website agar lebih menarik dan mudah dibaca oleh user. walaupun penulis merasa, Penggunaan Format text pada HTML ini jarang dipakai oleh beberapa developer, tapi perlu kita pelajari dan pahami.

Mengenal Beragam Format Text Pada HTML

Langsung saja ke topik pembicaraan kita, ini dia bermacam-macam format text pada HTML :

Format Text Big dan Small

Format Text Small digunakan untuk memperkecil suatu huruf ataupun kalimat. Format ini di tulis dengan perintah dan ditutup dengan kode tag. Contoh kode penulisan seperti berikut ini :

Tulisan, kata, atau kalimat

Kita coba aplikasikan kode tersebut pada file .html

<html>
<head>
<title>belajar memperkecil hurup dengan small</title>
</head>
<body>

artikel ini dibuat untuk belajar , agar bermanfaat
terimakasih telah berkunjung di<small>ariprayogiputra.blogspot.com</small> seperti itu gays.

</body>
</html>

Hasilnya akan tampak seperti pada gambar berikut ini, perhatikan pada tulisan ariprayogiputra.blogspot.com (tampak mengecil) :

Berbeda halnya dengan Small, Big digunakan untuk memperbesar suatu huruf atau kalimat. Tag big ini ditulis dengan perintah kode <big>, dan diakhiri dengan kode tag </big>. berikut ini penulisan lengkap kode tag big :

<big> kata atau kalimat </big>

Untuk melihat hasil dan cara penerapannya pada HTML, Silahkan ketikan kode berikut ini :

<html>
<head>
<title>belajar perintah big untuk memperbesar hurup</title>
</head>
<body>

suatu ketika didalam tempat yang sejuk dan sepi tiba tiba ada seekor ular. ular tersebut <big>adalah</big> ular berparas mempesona, berambut pirang, dan bertubuh manusia, ternyata itu bukan ular itu hanya namanya saja."lihat kata adalah"

</body>
</html>

Buka dengan aplikasi browser, hasilnya akan tampak seperti gambar berikut ini (perhatikan kata adalah dibawah ini):

Format Text Strong dan Emphasize

Strong dan Emphasize di gunakan untuk mengubah atau memodif teks agar lebih menarik dan dapat memperjelas suatu text. Fungsi tag ini biasanya digunakan untuk membedakan kata yang satu dengan kata yang lainnya.

Fungsi utama dari dari strong sendiri yaitu untuk mempertebal suatu text, strong sendiri ditulis dengan perintah dan diakhiri dengan tag . penulisan kode strong, seperti berikut ini :

text

Silahkan buka editornya, dan ketikan script kode html seperti dibawah ini :

<html>
<head>
<title>belajar strong guys</title>
</head>
<body>

gue <strong>adalah</strong> manusia

</body>
</html>

Hasilnya akan tampak seperti gambar berikut ini :

Selanjutnya adalah Emphasize yang berarti menekankan. tag ini juga digunakan untuk menekankan huruf menjadi miring. Emphasize ini memiliki fungsi yang sama dengan perintah italic, penulisan kode emphasize yaitu seperti berikut ini :

kata atau kalimat

Sekarang, silahkan ketikan kode berikut pada notepad kamu :

<html>
<head>
<title>belajar emphasize </title>
</head>
<body>

pada suatu hari ari pergi ke kota yang bernama toke dan pada saat itu ada suara terdengar seperti <em>macan, angsa, kambing dan lalat.</em>

</body>
</html>

Hasil kodenya akan tampak seperti gambar berikut ini, perhatikan pada kata macan, angsa :

Format Text Strike, Subscrift, dan Superscrift

Strike, Fungsi ini digunakan untuk mencoret suatu kata atau kalimat, Perintah strike di tuliskan dengan kode :

<strike> kata atau kalimat </strike>

Penulisan kode pada file Htmlnya Seperti Berikut :

<html>
<head>
<title>belajar strike</title>
</head>
<body>

selamat discount bagi anda harga sepatu dari harga <strike>Rp.2.000.000,-00</strike> menjadi 10.000.000,-00.
promo ini dikhususkan untuk anda.

</body>
</html>

Hasil di Browser akan tampak seperti gambar berikut ini :

Lanjutkan ke fungsi Subscrift,tag ini digunakan untuk pemangkatan bawah dan biasanya digunakan dalam rumus kimia perintahnya ditulis dengan tag dan diakhiri dengan . mari kita aplikasikan pad file HTML.

<html>
<head>
<title>belajar subscrift dengan fungsinya yaitu untuk pangkat bawah</title>
</head>
<body>

rumus kimia dari air yaitu adalah H<sub>2</sub>O

</body>
</html>

Hasil akhir dapat dilihat pada gambar berikut ini :

Selanjutnya Tag Superscrift, fungsi dari tag superscrift ini adalah kebalikan dari subscrift. Jika Subscrift fungsinya untuk pangkat bawah, Maka superscrift digunakan untuk pangkat bawah. Penulisan perintah superscrift ditulis dengan :

Kata atau Kalimat

Mari kita aplikasikan lagi pada file HTML, ketikan kode berikut ini :

<html>
<head
<title>belajar superscrift dengan fungsinya untuk pangkat atas</title>
</head>
<body>
hasil dari 5<sup>2</sup> =25 penjelasan; (lima pangkat dua sama dengan dua puluh lima)

</body>
</html>

Hasilnya kurang lebih seperti gambar berikut :

Format Text Plaintext dan XMP

Fungsi dari paintext dan XMP sendiri yaitu agar bahasa pemrograman yang ditampilkan diproses atau dieksekusi oleh system.

Kode tag plaintext sendiri ditulis dengan perintah <plaintext>dan diakhiri dengan kode tag</plaintext>. penulisan kode seperti beriukut ini :

<html>
<head>
<title>belajar plaintext</title>
</head>
<body>

tuliskan scrift htmlnya, ini akan ditayangkan di halaman:
<plaintext>
<html>
<head>
<title>.......</title>
</head>
<body>
.................
................
</body>
</html>
ini tidak akan dieksekusi
</plaintext>

</body>
</html>

Hasilnya akan tampak seperti gambar berikut ini, untuk melihat perbedaanya, kamu dapat mecoba untuk menghapus kode <plaintext> dan </plaintext> :

Tag XMP juga memiliki fungsi yang sama, penulisannya seperti kode berikut :

<xmp> kata, kode, atau kalimat, ditutup dengan </xmp>

Penerapannya juga sama pada plaintext, silahkan kamu ubah kode tag plaintext diatas dengan kode xmp.

Artikel sebelumnya kita membahas tentang :

Cara Mempertebal dan Memiringkan Tulisan di HTML