Chapter 2. Format Karakter
Format terhadap karakter yang ditampilkan akan sangat berguna untuk membuat sebuah dokumen HTML yang menarik.Pemformatan karakter tersebut mencakup beberapa hal : 1) Logical Format 2) Physical Format 3) Tag
4) Tag 5) Karakter Khusus
2.1.
Logical Format Logical format akan menerapkan layout dokumen secara logis dan terstruktur. Tagtag yang termasuk logical format adalah sebagai berikut : 9 , digunakan untuk menandai suatu kutipan (Citation). 9 , digunakan untuk menampilkan kode-kode pemrograman, misalnya bahasa C. 9 <EM>, digunakan untuk menandai suatu teks yang ditekankan oleh penulis. 9 , digunakan untuk menandai suatu teks yang harus dimasukkan oleh user melalui keyboard. 9 <SAMP>, digunakan untuk menandai suatu teks yang dimaksudkan sebagai contoh. 9 <STRONG>, digunakan untuk menandai bagian yang terpenting dari suatu teks. 9 , digunakan untuk menampilkan nama variabel. 9 , digunakan untuk menandai sebuah subdefinisidari daftar definisi. Semua tag tersebut memerlukan tag penutupnya masing-masing.
Created by Ahlihi Masruro,S.Kom
Latihan 6.html <TITLE> Logical Format Tom Sawyer adalah salah satu tokoh penting di dunia sastra amerika.
Kode yang paling pertama dipelajari oleh programmer C adalah :puts (“Hello World!”);
Ia berkata , “Sekali tidak tetap <EM>tidak.”
Untuk berpindah ke direktor root , ketikkan cd / .
Pada abjad terdapat 5 huruf vokal, yaitu <SAMP>AEIUO.
Hal yang harus diingat-ingat adalah <STRONG>Jangan Panik !
Kode program tersebut diiterasi sebanyak N kali .
Trenggiling adalah hewan pemakan semut.
Created by Ahlihi Masruro,S.Kom
2.2.
Physical Format Physical format adalah format terhadap fisik suatu font. Tag-tag yang termasuk physical format adalah sebagai berikut : 9 , untuk menampilkan huruf tebal. 9 , untuk menampilkan huruf miring. 9 , untuk menampilkan garis bawah pada teks. 9 , untuk menampilkan huruf seperti huruf mesin ketik. 9 <STRIKE>, untuk menampilkan garis horizontal pada bagian tengah huruf. 9 , untuk menampilkan ukuran huruf yang lebih besar. 9 <SMALL>, untuk menampilkan ukuran huruf yang lebih kecil. 9 <SUB>, untuk menampilkan subscript. 9 <SUP>, untuk menampilkan superscript.
Latihan 7.html <TITLE> Memformat Karakter kalimat ini akan dicetak tebal.
kalimat ini akan dicetak miring
kalima ini akan bergaris bawah
<STRIKE> kalimat ini akan bergaris tengah
menampilkan huruf seperti huruf mesin ketik.
Untuk menampilkan <SUB>subscript
Untuk menampilkan <SUP>subscript
Created by Ahlihi Masruro,S.Kom
2.3.
Tag Untuk
membuat
indentasi
paragraph
kita
bisa
menggunakan
BLOCKQUOTE.Dengan perintah browser akan menampilkan teks menjorok ke dalam ( mengindentasi teks ) atau menampilkan teks. Latihan 8.html Quotes/indentasi Quote atau Indentasi Dengan HTML, Anda dapat mengatur indentasi text yang Anda buat dengan menggunakan tag BLOCKQUOTE
Ini adalah paragraf yang menggunakan blockquote, Anda dapat melihat perbedaanya ketika script ini Anda jalankan. Kira-kira sampai disini Anda mengerti atau tidak??Kalau tidak,yuk tanya dan kita sharing......
Nah, Anda sudah mengetahui perbedaannya kan??Jadi, belajar HTML itu tidak sulit dan Anda bisa mencoba banyak hal disini.
Created by Ahlihi Masruro,S.Kom
2.4.
Tag Dengan tag anda bisa menentukan format tampilan font dalam document HTML seperti color, size dan lainnya.
2.4.1. Ukuran Font Atribut SIZE digunakan untuk mengatur ukuran font. Nilai font dimulai dengan nilai 1 untuk ukuran huruf terkecil dan nilai 7 untuk ukuran paling besar.
2.4.2. Jenis Font Atribut FACE digunakan untuk mengatur jenis huruf yang diinginkan. Atribut FACE harus diisi dengan string jenis font seperti Arial, Times New Roman, Verdana dan lain sebagainya.
2.4.3. Warna Font Atribut COLOR digunakan untuk mengatur warna font yang diinginkan. Untuk memberi nilai pada atribut color ada dua cara, yaitu : 1. Dengan menyebutkan nama warna seperti red, green dan blue. 2. Dengan menggunakan nilai RGB ( Red Green Blue ) dari satu warna misalnya FF0000 untuk red, 00FF00 untuk green dan 0000FF untuk Blue. Latihan 9.html Formating Teks Menggunakan Font dan Atributnya
Teks ini menggunakan atribut FACE
Teks ini menggunakan atribut SIZE
Teks ini menggunakan atribut COLOR
Created by Ahlihi Masruro,S.Kom
Latihan 10.html Formating Teks Menggunakan Font dan Atributnya
Teks ini menggunakan atribut FACE dan COLOR
Teks ini menggunakan atribut SIZE dan FACE
Teks ini menggunakan atribut COLOR, FACE dan SIZE
Created by Ahlihi Masruro,S.Kom
Sebagai latihan, buatlah script HTML sehingga hasilnya akan tampak seperti berikut ini! Gunakan tag-tag HTML beserta atributnya yang telah kita pelajari!
2.5.
Karakter Khusus Tanda lebih kecil (<) dan lebih besar (>) merupakan tag HTML, lalu bagaimana cara untuk menuliskan tanda tersebut ke dalam dokumen web kita ? Caranya adalah dengan menuliskan entitas karakter yang mempunyai 3 bagian: sebuah ampersand (&), sebuah nama entitas atau sebuah # dan nomor entitas, dan sebuah titik koma. Contoh : Untuk menampilkan tanda lebih kecil kita harus menuliskan : < atau <
Tabel 1. Karakter khusus Hasil
Keterangan
Nama Entitas
Nomor Entitas
©
Copyright
©
©
®
Registered Trademark
®
®
x
Tanda kali
×
×
±
Plus minus
±
±
Created by Ahlihi Masruro,S.Kom
Latihan 11.html <TITLE> Memformat Karakter copyright ©
registered trademark ®
trademark ™
non-breaking space
ampersand &
« angle quotation mark (left)
angle quotation mark (right) »
"tanda kutip "
lebih kecil <
lebih besar >
tanda kali ×
tanda bagi ÷
Created by Ahlihi Masruro,S.Kom
2.6.
Preformatted Text Preformatted text digunakan untuk menampilakan teks sama seperti yang Anda ketikkan dalam dokumen HTML. Browser akan menampilkan teks tersebut dalam font monospaced, yaitu seperti terlihat dalam teks yang ditampilkan oleh aplikasi berbasiskan teks. Sebagai contoh, cobalah latihan berikut ini : Latihan 12.html Formating Teks Moncoba PreFormatted Text <pre> -----------Ketika Anda membuat ini, maka hasilnya sama dengan tampilan pada browser -----------------************ Coba yang ini....sama saja kan??? ************************************
Created by Ahlihi Masruro,S.Kom
2.7.
Grouping Element Tag DIV dan SPAN digunakan untuk mengelompokkan element-element HTML. Span digunakan untuk mendefinisikan inline content, sementara div digunakan untuk blocklevel content. Latihan 13.html Div dan Span Divisi 1
Div tag digunakan untuk mengelompokkan group element biasanya untuk blocklevel element.
Divisi 2
Ini didalam devisi kedua. di tulis dengan alignment kanan.
<span style="font:Georgia; color:#66CC00; font-size:30"> baris ini dalam span dengan warna hijau.
Created by Ahlihi Masruro,S.Kom
Latihan 14.html Nazneen Online Bookstore
NAZNEEN ONLINE BOOKSTORE
Jl. Cempaka 143 A Condong Catur Depok Sleman Yogyakarta
Telp.0274 - 882174
Created by Ahlihi Masruro,S.Kom