Wednesday, March 12, 2014
Sebuah tampilan webpage hampir sama layaknya sebuah dokumen yang menggunakan pemformatan dalam tampilannya. Namun cara pemformatan dalam sebuah webpage (html) tidak semudah pemformatan pada word doccument. Namun seiring bertambah canggihnya software webpage builder saat ini, pemformatan pada html juga sudah lebih mudah dengan adanya fitur WYSIWYG editor. Namun kali ini Gudang Receh akan membahas sedikit tentang pemformatan tulisan pada html, tidak dengan WYSIWYG mode, melainan dengan kode-kode html agar para pembaca lebih mengenal sebuah webpage yang dibangun dengan html. Dan posting kali ini juga sebagai tugas review materi mata kuliah yang diberikan oleh dosen pengampu. Berikut adalah contoh – contoh pemformatan tulisan pada html:
Pemformatan font:
Coba script ini pada software web builder yang anda gunakan, paling sederhana adalah dengan menggunakan "Notepad" dan simpan dengan ekstensi "nama_file.html".
<html>
<head>
<title></title>
</head>
<body>
<p><b>Teks ini tebal/bold.</b></p>
<p><i>Teks ini miring/italic.</i></p>
<p><u>Teks ini bergaris bawah/underline.</u></p>
<p><b><u><i>Teks ini tebal, miring, dan bergaris bawah.</i></u></b></p>
<p><mark>Teks ini bergaris ditandai/disorot.</mark></p>
</body>
</html>
Penjelasan:
- Tag <b>....</b> berfungsi untuk membuat teks tebal/bold.
- Tag <i>....</i> berfungsi untuk membuat teks miring/italic.
- Tag <u>....</u> berfungsi untuk membuat teks bergaris bawah/underline.
- Tag <mark>....</mark> berfungsi untuk membuat teks ditandai/disorot.
Warna, Jenis, dan Ukuran font.
- Tag <font color="green">....</font> membuat font yang ada di dalamnya berwarna hijau.
- Tag <font size="5>....</font> membuat font yang ada di dalamnya berukuran 5.
- Tag <font face="calibri">....</font> membuat font yang ada di dalamnya berjenis calibri.
- Tag <font color="green" size="5" face="calibri"> membuat font berwarna hijau, berukuran 5, dan berjenis calibri.</font>
List:
Coba script ini pada software web builder yang anda gunakan, paling sederhana adalah dengan menggunakan "Notepad" dan simpan dengan ekstensi "nama_file.html".
Ordered List:
- Tag <li>....</li> menunjukkan bahwa teks tersebut adalah list.
- Tag
<ol>
.
.
.
</ol>
menunjukkan jenis list yang di gunakan, yaitu OL = Ordered List.
Unordered List:
- Tag <li>....</li> menunjukkan bahwa teks tersebut adalah list.
- Tag
<ul>
.
.
.
</ul>
menunjukkan jenis list yang di gunakan, yaitu UL = Unordered List.
Itulah tadi sedikit review yang masih teringat di ingatan. Bagi para pembaca silahkan mencoba dan jangan lupa tinggalkan komentar. Tetap nantikan tulisan - tulisan menarik di Gudang Receh.
Tags: html, webpage, page, wysiwyg,
- Tag <b>....</b> berfungsi untuk membuat teks tebal/bold.
- Tag <i>....</i> berfungsi untuk membuat teks miring/italic.
- Tag <u>....</u> berfungsi untuk membuat teks bergaris bawah/underline.
- Tag <mark>....</mark> berfungsi untuk membuat teks ditandai/disorot.
Warna, Jenis, dan Ukuran font.
<html>Penjelasan:
<body>
<p><font color="green">Teks ini berwarna hijau.</font></p>
<p><font size="5">Teks ini berukuran 5.</font></p>
<font face="calibri">Teks ini menggunakan font calibri.</font>
<p><font color="green" size="5" face="calibri">Teks ini berwarna hijau</font></p>
</body>
</html>
- Tag <font color="green">....</font> membuat font yang ada di dalamnya berwarna hijau.
- Tag <font size="5>....</font> membuat font yang ada di dalamnya berukuran 5.
- Tag <font face="calibri">....</font> membuat font yang ada di dalamnya berjenis calibri.
- Tag <font color="green" size="5" face="calibri"> membuat font berwarna hijau, berukuran 5, dan berjenis calibri.</font>
List:
Coba script ini pada software web builder yang anda gunakan, paling sederhana adalah dengan menggunakan "Notepad" dan simpan dengan ekstensi "nama_file.html".
Ordered List:
<html>Penjelasan:
<head>
<title></title>
</head>
<body>
<ol>
<li>List 1</li>
<li>List 2</li>
<li>List 3</li>
</ol>
</body>
</html>
- Tag <li>....</li> menunjukkan bahwa teks tersebut adalah list.
- Tag
<ol>
.
.
.
</ol>
menunjukkan jenis list yang di gunakan, yaitu OL = Ordered List.
Unordered List:
<html>Penjelasan:
<head>
<title></title>
</head>
<body>
<ul>
<li>List 1</li>
<li>List 2</li>
<li>List 3</li>
</ul>
</body>
</html>
- Tag <li>....</li> menunjukkan bahwa teks tersebut adalah list.
- Tag
<ul>
.
.
.
</ul>
menunjukkan jenis list yang di gunakan, yaitu UL = Unordered List.
Itulah tadi sedikit review yang masih teringat di ingatan. Bagi para pembaca silahkan mencoba dan jangan lupa tinggalkan komentar. Tetap nantikan tulisan - tulisan menarik di Gudang Receh.
Tags: html, webpage, page, wysiwyg,
Iptekini
