::   HOME   ::   KOMPUTER    ::   INBOX  ::  SPORT  ::  ABOUT DANI  :: 
  ::  SEJARAH   ::    BASIC   ::    DESAIN WEB   ::    TIPS   ::   DOWNLOAD  ::  SOAL
     
  ::  DESAIN WEB  

Membuat combo box warna warni
 :: Tutorial Html   Combo box merupakan suatu "elemen" yang sering digunakan pada halaman
web yang memungkinkan seorang user untuk memilih salah satu dari
beberapa pilihan. Tampilan combo box tersebut seringkali standar, warna
latar putih dengan teks hitam.

Dengan style sheet kita dapat membuat tampilan combo box tersebut lebih
menarik. Misalnya dengan memberi warna tertentu pada huruf atau
backgroundnya. Sebagai contohnya Anda bisa menambahkan kode di
bawah ini ke dalam tag head pada halaman web Anda.

select.Menu{
font-family: Verdana,sans serif;
font-size: 14pt;
font-weight: bold;
font-style: normal;
}

option.MenuSatu{
color:#FFFFFF;
background-color:#FF0000;
}
option.MenuDua{
color:#FFFF00;
background-color:#0000FF;
}
option.MenuTiga{
color:#123456;
background-color:#FEDCBA;
}
</style>
 

Pada bagian select.Menu, Anda dapat mengatur setting huruf yang akan
digunakan pada combo box. font-family = untuk jenis hurufnya dan font-
size untuk ukuran huruf.

Pada option.MenuSatu, Anda dapat mengatur tampilan warna pada
combo box. Color untuk mengatur warna teks sedangkan background-color
untuk mengatur warna latar belakangnya.

Pada contoh di atas kami hanya menampilkan tiga contoh "menu". Jika
dirasa masih kurang, Anda dapat menambahkan sendiri. Tentunya dengan
mengikuti "pola" seperti pada contoh di atas. Lalu untuk contohnya Anda
dapat menggunakan form seperti pada contoh berikut ini:

<form>
<select class="Menu" size="1">
<option class="MenuSatu">Item Satu</option>
<option class="MenuSatu">Item Dua</option>
<option class="MenuSatu">Item Tiga</option>
<option class="MenuDua">Item Empat</option>
<option class="MenuDua">Item Lima</option>
<option class="MenuDua">Item Enam</option>
<option class="MenuTiga">Item Tujuah</option>
<option class="MenuTiga">Item Delapan</option>
<option class="MenuTiga">Item Sembilan</option>
</select>
</form>
 
 :: Tips Html  
     :: mencegah klik kanan  
     :: Menampilkan keterangan pada link  
     :: Background warna pada teks  
     :: membuat browser menari  
     :: Menampilkan title pada link  
     :: menambahkan efek pada tabel  
     :: membuat tombol 3 dimensi  
     :: halaman web dengan overlib  
     :: membuat combo box warna warni  
     :: Back dan Forward dengan java script  
     :: Membuat Bookmark dengan link  
     :: Situs tidak ter-update no cache  
     :: Mengganti warna scrollbar  
     :: Cool Web Scrollbars  
 :: Artikel