Radio button merupakan bagian dari elemen input form. Saat ingin memberikan style pada radio button dapat menggunakan selector input.selector. Contoh berikut adalah style CSS pada input yang bertipe pilihan radiobutton :
<HTML>
<HEAD>
<TITLE>Pengaturan pada Form</TITLE>
<STYLE ="text/css">
INPUT.rb1{ background: blue ;
border-color:white;
font-family:verdana;
font-size:12px; }
INPUT.rb2{ background: green ;
border-color:white;
font-family:verdana;
font-size:12px;}
</STYLE>
</HEAD>
<BODY>
<form name="form1" method="post" action="">
<TABLE bordercolor="1">
<TR>
<TD width="58" >Kelamin</TD>
<TD width="230" >:
<input type="radio" name="radiobutton"
value="radiobutton" class="rb1">
Pria /Male</TD>
</TR>
<TR>
<TD width="58"> </TD>
<TD width="230" >
<input type="radio" name="radiobutton"
value="radiobutton" class="rb2">
Wanita/Famale </TD>
</TR>
</TABLE>
</form>
</BODY>
</HTML>
Untuk menerapkan style input.rd1 dan input.rd2 maka pada tag <input type="radio" > perlu memanggil style tersebut dengan cara class=”rd1” dan class=”rd2” .
Sehingga ketika listing kode diatas dijalankan akan muncul tampilan radio button seperti berikut ini gambar diatas.
Tidak ada komentar:
Posting Komentar