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 :
<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 :
komentar tidak berisi spam.
terima kasih ConversionConversion EmoticonEmoticon