Color
Merupakan attribute yang bisa anda tambahkan pada beberapa element seperti body, font, link, dll. Color dibagi menjadi 3 kategori warna primer yaitu red, green & blue. Masing-masing color didefinisikan dalam 2 digit hexadecimal number.
Hexadesimal Color
#FF0000 Red
#00FF00 Green
#0000FF Blue
#000000 Black
#FFFFFF White
· Pre
Tag untuk menampilkan text sesuai dengan aslinya.
· Hyperlink
Link Address
ú Absolute Address : merupakan full internet address (URL) yang meliputi protocol, network location and path & nama file.
Contoh : http://www.yahoo.com/index.html
ú Relative Address : URL yang tidak menyebutkan protocol & network location-nya (hanya path & nama file).
Anchor
Tag <a> untuk menentukan hyperlink dalam document HTML, HREF property digunakan untuk menentukan tujuan dari hyperlink tersebut.
Contoh :
<a href=”URL”> Hypertext </a>
<a href “protocol”//hoat : Jomain : port/path/file name”> Hypertext </a>
· Table
¨ Membuat Table
Tag <table> digunakan untuk membuat table dalam doc. HTML, bagian pokok dari table adalah cell yang didefinisikan dengan tag <td>.
Berikutnya, jika ingin membuat beberapa baris cell dalam table menggunakan tag <tr>.
¨ Menambahkan Heading Cell
Menggunakan tag <th>
¨ Pemformatan Table
Untuk memformat perataan text didalam table anda bisa gunakan attribute align &b valign (vertical align).
Attribute Value
Align Center Justify Right Left
Valign Baseline Top Bottom Middle
© Image
3 jenis yang sering digunakan :
- GIF (Graphical Interchange Format).
- JPEG (Joint Photographic Expert Image).
- PNG (Portable Network Grapgics).
<img src=”URL”>
Attribute
|
Value
|
Description
|
Align
|
Center, Justify, Left, Right, Baseline, Top, Bottom, Middle
|
Top, Bottom, Middle
digunakan untuk menentukan posisi image terhadap text. |
Left, right, center untuk
menentukan posisi image di doc. |
© Form
Kegunaan Form
1. Memperoleh data-data user baik nama, alamat & data lainnya.
2. Memperoleh informasi pembelian secara online.
3. Memperoleh feedback dari user mengenai website anda.
Kegunaan Element
Tag <form> digunakan untuk membuat form di HTML.
Attribute
|
Description
|
Accept
|
Mendefinisikan MIME yang diizinkan
oleh server yang memuat script untuk memproses form. Sintax :
Accept = “Internet Media Type”
|
Method
|
Menentukan bagaimana data akan
dikirim ke server. Get data akan dikirim dengan menggunakan query string pada URL Post data akan dikirim ke server sebagai block data ke script. Sintax :
Method = “Post/Get”
|
Action
|
Menentukan lokasi dari script yang
akan memproses data dari form. Sintax :
Action = “URL”
|
© Frame
Dasar Penggunaan Frame
Frame memungkinkan 1 halaman web / lebih ditampilkan pada sebuah jendela browser. Untuk mempraktikan frame, buatlah terlebih dahulu 2 berkas HTML bersama framekir.htm & framekan.htm.
~ File framekir.htm :
<html>
<head>
<title> Frame Kiri </title>
</head>
<body bgcolor=”white”>
<head>
<title> Frame Kiri </title>
</head>
<body bgcolor=”white”>
<h1> Frame disebelah kiri </h1>
</body>
</html>
</html>
~File framekan.htm :
<html>
<head>
<title> Frame Kanan </title>
</head>
<body bgcolor=”white”> <h1> Frame di sebelah kanan </h1>
</body>
</html>
<head>
<title> Frame Kanan </title>
</head>
<body bgcolor=”white”> <h1> Frame di sebelah kanan </h1>
</body>
</html>
Halaman berbasis frame dibentuk dengan menggunakan pasangan <frameset> & </frameset>, attribute cols digunakan untuk menentukan lebar masing-masing frame.
Contoh :
<html>
<head>
<title> Contoh penggunaan frame </title>
</head>
<title> Contoh penggunaan frame </title>
</head>
<frameset cols=”30%,*”>
<frame src=”framekir.htm”>
<frame src=”framekan.htm”>
</frameset>
</html>
</html>
Mengantisipasi Tidak Adanya Dukungan Frame
Ada kemungkinan bahwa web browser yang digunakan pemakai tidak mendukung fitur frame. Untuk mengatur agar ada pemberitahuan bahwa halaman web hanya bisa dilihat denga browser yang mendukung frame digunakan pasangan tag <noframes> & </noframes>.
Contoh :
<html>
<head>
<title> Contoh penggunaan frame </title>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset cols=”30%,*”>
<frameset cols=”30%,*”>
<frame scr=”framekir.htm”>
<frame scr=”framekan.htm”>
<noframes> Sayang sekali halaman ini tak dapat dibuka karena browser anda tidak mendukung frame. </noframe>
</frameset>
</html>
</html>
Menggunakan Border
Attribute BORDER pada tag <frameset> berguna untuk mengatur ketebalan garis pemisah antar frame. Contoh :
<html>
<head>
<title> Contoh penggunaan frame </title>
</head>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset cols=”30%,*” border=”0”>
<frame scr=”framekir.htm”>
<frame scr=”framekan.htm”>
<frame scr=”framekan.htm”>
</frameset>
</html>
</html>
· Menghilangkan Scrolling
<html>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset cols=”30%,*” border=”0”>
<frameset cols=”30%,*” border=”0”>
<frame src=”framekir.htm” scrolling=”no”>
<frame src=”framekan.htm”>
</frameset>
</html>
</html>
· Frame & Link
Untuk mempraktekan penggabungan pemakaian frame yang melibatkan link ke frame yang lain, buatlah 3 file HTML berikut!
1. File redflash.htm :
<html>
<head>
<title> </title>
<head>
<title> </title>
</head>
<body>
<h2> Redflash </h2>
<body>
<h2> Redflash </h2>
Mempunyai warna merah disekitar tulang daun & bintik-bintik putih di daerah yang berwarna hijau.
</body>
</html>
</html>
2. File rosebud.htm :
<html>
<head>
<title> </title>
<head>
<title> </title>
</head>
<body>
<h2> Rosebud </h2>
<body>
<h2> Rosebud </h2>
Mempunyai warna dasar hijau dibagian pinggir, disekitar tulang daun berwarna merah jembu & bagian tepi daun berwarna putih.
</body>
</html>
</html>
3. File daftar.htm :
<html>
<head>
<title> </title>
</head>
<body>
<center>
<a href=”redflash.htm” target=”dinamis”>
</head>
<body>
<center>
<a href=”redflash.htm” target=”dinamis”>
<h2> Redflash </h2>
</a>
<a href=”rosebud.htm”> target=”dinamis”>
<h2> Rosebud </h2>
</a>
</center>
</body>
</html>
</body>
</html>
Pada file daftar.htm, attribute Target digunakan untuk menentukan frame yang ditempati oleh halaman web yang dipanggil.
Kode yang digunakan untuk menggabungkan ke 3 file diatas adalah seperti berikut :
<html>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset cols=”30%,*”>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset cols=”30%,*”>
<frame src=”daftar.htm”>
<frame src=”redflash.htm” name=”dinamis”>
</frameset>
</html>
</html>
§ Frame Horizontal
HTML juga memungkinkan pembuatan frame horizontal. Caranya dengan attribute cols pada <frameset> menjadi rows. Contoh :
<html>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset rows=”30%,*”>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset rows=”30%,*”>
<frame src=”daftar.htm”>
<frame src=”redflash.htm” pdname=”dinamis”> </frameset>
</html>
</html>
- Penggunaan Noresize
Attribute noresize pada tag <frame> digunakan agar frame tidak bisa diubah ketika ditampilkan pada browser.
Contoh :
<html>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset rows=”30%,*”>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset rows=”30%,*”>
<frame src=”daftar.htm”>
<frame src=”redflash.htm” noresize name=”dinamis”>
</frameset>
</html>
</html>
Gabungan frame horizontal & vertical :
<html>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset rows=”30%,*”>
<head>
<title> Contoh penggunaan frame </title>
</head>
<frameset rows=”30%,*”>
<frame src=”judul.htm” scrolling=”no”>
<frameset border=”0” cols=”30%,*”>
<frame src=”daftar.htm” scrolling=”no”>
<frame src=”redflash.htm” name=”dinimis”>
</frameset>
</frameset>
</html>
</frameset>
</html>
File judul.htm :
<html>
<head>
<title> </title>
<body background=”keladi.jpg”>
<center>
<img src=”judul.gif”>
</body>
<head>
<title> </title>
<body background=”keladi.jpg”>
<center>
<img src=”judul.gif”>
0 100 komentar:
Posting Komentar