KOMPUTER APLIKASI IT-I (HTML)
PERTEMUAN 4
Dosen : Bella Hardiyana S. Kom
Phisical Style
Phisical style adalah suatu jenis format suatu text. Sebenarnya kita sering menjumpai hal
seperti ini, misalnya ada suatu kata berbahasa inggris dan tulis miring, seperti : computer,
address, mountain, dsb. Atau ada kata penting yang digaris bawahi atau malah ditulis dengan huruf besar. Berikut adalah jenis-jenis phisical style.
Phisical Style
Elemen Fungsi
<big> text </big> membuat tulisan menjadi lebih besar
<small> text
</small>
membuat tulisan menjadi lebih kecil
<strong> text
</strong>
menebalkan tulisan
<b> text </b> menebalkan tulisan
<i> text </i> membuat tulisan miring
<u> text </u> membuat tulisan digaris bawahi
<s> text </s> memberikan coretan pada teks
<blink> text </blink> membuat tulisan berkedip
<sub> text </sub> membuat tulisan subscript
<sup> text </sup> membuat tulisan supperscript
Memformat Font
Kita bisa memformat font/huruf seperti warna, jenis atau ukuran.
<font> Isi Tulisan </font>
Berikut adalah atribut dari tag <font>.
Atribu
t Argumen Keterangan
face Diisi dengan nama font Mengatur jenis huruf color Diisi dengan warna RGB
(#RRGGBB) atau nama warna
Mangatur warna huruf
size Diisi dengan angka 1 s/d 7 Mengatur ukuran huruf
Memformat Font
Warna yang menggunakan kata (inggris) hanya berjumlah 16 buah, yaitu : Aqua, Black, Blue, Fuchsia, Gray, Green, Lime, Maroon, Navy, Olive,
Purple, Red, Teal, White, Yellow, Silver
Cara lain yang dapat digunakan untuk menset warna lain, yaitu dengan hex code. Penulisan hex code dimulai karakter pagar (#) dan diikuti kombinasi RGB (Red, Green, Blue). Setiap satu warna tersebut
intensitasnya berupa hex 2 karakter, misalnya #FFEEA4 yang artinya
intensitas Red (merah) = FF = 255, Green (hijau) = EE = 238, Blue (biru) = A4 = 164.
Contoh penulisan dengan hex code :
#FF0000 = merah, #00FF00 = hijau, #0000FF = biru, #FFFFFF = putih,
#000000 = hitam
Face = diisi dengan nama font seperti : arial, calibri, courier new, segoe ui, dsb.
Color = diisi dengan nama warna atau hexcode (#RRGGBB).
Size = diisi dengan ukuran huruf dengan nilai dari 1 s/d 7.
Menyisipkan haris horizontal
Untuk membuat garis horizontal, diperlukan tag
<hr> (horizontal rule). Ada beberapa atribut yang dapat digunakan untuk mengubah tampilan garis.
Berikut adalah atribut yang dapat digunakan.
Atribut Argumen Keterangan
Align Center, Left, Right
melakukan perataan pada garis yang dibuat
Noshade - memunculkan efek tanpa bayang-bayang 3-D
Size Piksel, % menentukan ukuran ketebalan garis argumen dapat berupa piksel atau persen Width Piksel, %
menentukan ukuran panjang garis, argumen dapat berupa piksels atau persen
Color Nama warna,
hexcode memberi warna pada garis
Membuat List/Daftar
List/daftar adalah poin-poin informasi yang
biasanya ditulis secara singkat, padat dan jelas.
Dalam pembuatan website yang baik terkadang kita membutuhkan informasi yang dijabarkan
oleh poin-poin pokok, untuk itu kita
membutuhkan list/daftar. HTML menyediakan beberapa jenis daftar, yaitu:
Ordered list/numbered list <ol> (daftar bernomor)
Unordered list/bulleted list <ul> (daftar tidak bernomor/menggunakan simbol)
Definition list <dl> (glossary/daftar istilah)
Ordered List <ol>
Ordered list atau numbered list adalah suatu daftar dimana item-item yang ada di dalam daftar tersebut memiliki nomor/abjad secara
berurut. Ordered list dimulai dengan tag awal <ol> dan diakhiri dengan tag akhir </ol>. Sedang untuk menyatakan list item,
menggunakan tag <li>. Berikut ini adalah atribut dari ordered list.
Atribut Argumen Keterangan
type
1 (angka normal) Diwakili dengan urutan angka I (romawi besar)
atau i (romawi kecil)
Diwakili dengan urutan angka romawi
A (alfabet besar)
atau a (alfabet kecil) Diwakili dengan urutan alfabet start nomor urut awal Dimulai dari urutan ke-berapa
Unordered List <ul>
Unordered list/bulleted list adalah suatu daftar dimana urutan tidak diutamakan, jadi item-item dalam daftar tidak diwakili oleh nomor ataupun abjad terurut melainkan dengan simbol.
Unordered list dimulai dengan tag <ul> dan diakhiri dengan tag </ul>. Sedang isi daftar menggunakan tag <li>. Berikut ini adalah atribut dari ordered list.
Atribut Argumen Keterangan
type
disc Simbol lingkaran hitam
circle Simbol lingkaran putih/cincin square Simbol kotak hitam
Definition List <dl>
Definition List/List Definisi biasanya digunakan untuk mendefinisikan atau menjelaskan istilah- istilah. Untuk membuat definition list terdapat tiga tag yang digunakan yaitu sebagai berikut :
Nama Tag Fungsi
<dl>….<dl
>
Tag inti list definisi
<dt> Istilah yang akan didefinisikan atau subpokok dari <dl>
<dd> Definisi dari istilah tersebut atau isi dari
<dt>