Format Teks
Dalam penulisan HTML sangat sering menggunakan format text didalamanya, baik itu dalam penulisan judul, ataupun isi dari content/halaman website sendiri. Berikut beberapa penjelasan dan contoh dari Format Text Pada HTML.
Format Text Pada HTML
Ada beberapa format text yang umumnya di gunakan, di antaranya adalah:
Membuat huruf tebal (bold) pada HTML
Untuk membuat teks menjadi tebal pada tampilan halaman web, kita bisa menggunakan tag <b> berikut contoh syntax HTML untuk membuat format text tebal :
<b>Teks ini memakai fungsi Bold</b>
Maka akan terlihat seperti ini :
Teks ini memakai fungsi Bold
Membuat huruf miring (italic) pada HTML
untuk membuat teks menjadi miring pada HTML, kita bisa menggunakan tag <i>. contohnya:
<i>Teks ini memakai fungsi Italic</i>
Maka akan terlihat seperti ini :
Teks ini memakai fungsi Italic
Membuat huruf bergaris bawah (underline) pada HTML
untuk membuat teks underline/garis bawah pada HTML, kita bisa menggunakan tag <u>.
contohnya :
<u>Teks ini memakai fungsi Underline</u>
Maka akan terlihat seperti ini :
Teks ini memakai fungsi Underline
Dibawah ini Format Teks yang sering digunakan dalam HTML.
Tag
|
Keterangan
|
<b> ... /b>
|
Format Teks Untuk Menebalkan Huruf
|
<i> ... </i>
| Format Teks Untuk Memiringkan Huruf |
<u> ... </u>
| Format Teks Untuk Menggaris Bawahi Huruf |
<em> ... </em>
| Format Teks Untuk Memiringkan Huruf |
<small> </small>
| Format Teks Untuk Mengecilkan Huruf |
<strong></strong>
| Format Teks Untuk Menebalkan/Menegaskan Huruf |
<sub></sub>
| Format Subscripted Teks |
<sup></sup>
| Format Superscripted Teks |
<ins></ins>
|
Format Teks Garis Bawah
|
<del></del>
|
Format Teks dengan Garis ditengah |
<mark></mark>
| Format Teks yang ditandai dengan block warna |
Untuk lebih jelasnya silahkan lihat contoh berikut ini :
<!DOCTYPE html>
<html>
<head>
<title>belajar format text</title>
</head>
<body>
<b>ini format format text tebal</b><br/>
<i>ini format text italic</i><br/>
<u>ini format text underline</u><br/>
<em>ini format text em</em><br/>
<small>ini format text small</small><br/>
<strong>ini format text strong</strong><br/>
<sub>ini format text sub</sub><br/>
<sup>ini format text sup</sup><br/>
<ins>ini format text ins</ins><br/>
<del>ini format text del</del><br/>
<mark>ini format text mark</mark>
</body>
</html>
<html>
<head>
<title>belajar format text</title>
</head>
<body>
<b>ini format format text tebal</b><br/>
<i>ini format text italic</i><br/>
<u>ini format text underline</u><br/>
<em>ini format text em</em><br/>
<small>ini format text small</small><br/>
<strong>ini format text strong</strong><br/>
<sub>ini format text sub</sub><br/>
<sup>ini format text sup</sup><br/>
<ins>ini format text ins</ins><br/>
<del>ini format text del</del><br/>
<mark>ini format text mark</mark>
</body>
</html>
ini format format text tebal
ini format text italic
ini format text underline
ini format text em
ini format text small
ini format text strong
ini format text sub
ini format text sup
ini format text ins
ini format text mark
Paragraf
Untuk memahami pembuatan paragraf <p> pada HTML, diharapkan anda terlebih dahulu sudah memahami penulisan dan apa itu tag, element, atribut. Paragraf disini merupakan suatu tag untuk membuat penulisan dalam bentuk paragraf. Tag paragraf ini terdapat 3 attribut/tag yang bisa dikombinasikan langsung dengan tag paragraf <p>, atribut tag tersebut yaitu :- Membuat paragraf rata kiri menggunakan <p align=”left”> .. isi paragraph </p>
- Membuat paragraf rata kanan menggunakan <p align=”right”> .. isi paragraph </p>
- Membuat paragraf rata tengah menggunakan <p align=”center”> .. isi paragraph </p>
- Membuat paragraf rata kiri kanan menggunaan <p align=”justify”> .. isi paragraph </p>
Paragraf menggunakan <p>, berikut implementasi <p> dalam dokumen HTML.
<!DOCTYPE html>
<html>
<head>
<title>Belajar Membuat Paragraf</title>
</head>
<body>
<p>ini merupakan penulisan paragraf pertama dalam dokument HTML</p>
<p>ini merupakan penulisan paragraf kedua dalam dokument HTML</p>
</body>
</html>
<html>
<head>
<title>Belajar Membuat Paragraf</title>
</head>
<body>
<p>ini merupakan penulisan paragraf pertama dalam dokument HTML</p>
<p>ini merupakan penulisan paragraf kedua dalam dokument HTML</p>
</body>
</html>
Maka akan terlihat seperti ini :
ini merupakan penulisan paragraf pertama dalam dokument HTML
ini merupakan penulisan paragraf kedua dalam dokument HTML
Dari contoh di atas dapat anda lihat bahwa penulisan paragraf pertama dan paragraf kedua dipisahkan. Untuk memisahkan antara paragraf satu dan dua ini menggunakana <p>.
Jenis paragraph
Berikut ini adalah beberapa contoh jenis paragraf pada HTML.
Paragraf rata kiri
<p align="left"> berfungsi untuk penulisan paragraf rata kiri dalam dokumen HTML</p>
Paragraf rata kanan
<p align="right"> berfungsi untuk penulisan paragraf rata kanan dalam dokumen HTML</p>
Paragraf Rata Tengah
<p align="center"> berfungsi untuk penulisan paragraf rata tengah dalam dokumen HTML</p>
Paragraf Rata Samping
<p align="justify"> berfungsi untuk penulisan paragraf rata samping dalam dokumen HTML</p>
<!DOCTYPE html>
<html>
<head>
<title>belajar membuat paragraf</title>
</head>
<body>
<p align="left"> Contoh penulisan paragraf rata kiri dalam dokumen HTML</p>
<p align="right"> Contoh penulisan paragraf rata kanan dalam dokumen HTML</p>
<p align="center"> Contoh penulisan paragraf rata tengah dalam dokumen HTML</p>
<p align="justify"> Contoh penulisan paragraf rata samping dalam dokumen HTML</p>
</body>
</html>
<html>
<head>
<title>belajar membuat paragraf</title>
</head>
<body>
<p align="left"> Contoh penulisan paragraf rata kiri dalam dokumen HTML</p>
<p align="right"> Contoh penulisan paragraf rata kanan dalam dokumen HTML</p>
<p align="center"> Contoh penulisan paragraf rata tengah dalam dokumen HTML</p>
<p align="justify"> Contoh penulisan paragraf rata samping dalam dokumen HTML</p>
</body>
</html>
Maka akan terlihat seperti ini :
Contoh penulisan paragraf rata kiri dalam dokumen HTML
Contoh penulisan paragraf rata kanan dalam dokumen HTML
Contoh penulisan paragraf rata tengah dalam dokumen HTML
Contoh penulisan paragraf rata samping dalam dokumen HTML
Untuk pelajaran Format Teks dan Paragraf, kita cukupkan sekian.
Selanjutnya kita akan mempelajari "Cara Membuat Tabel Sederhana dalam HTML"
Komentar spam, menyertakan Link Aktif dan Alamat Blog tidak akan muncul.
Kami menerima masukan dari anda jika memang ada pembahasan yang keliru.
kami sangat senang jika anda dapat berkontribusi untuk menyempurnakan postingan kami.
EmoticonEmoticon