Промяна стила на input - radio

[Illusion]

Как да сменя стила на кръгчето с моя картинка? Трябва ми за две radio бутончета да задам различен стил!

 

[DireWolf]

CSS:

input[type="radio"] { CSS STYLE }

 

[Illusion]

CSS:

input[type="radio"] { CSS STYLE }

Не се показва картинката, а кръгът си се показва още...

 

[marian]

Само със css неможеш да промениш стила на някои елементи, затова трябва малко javascript. Ето ти код, на който трябва само да промениш css кода (смени картинката и размерите).

<script type="text/javascript">
function rbcc(el) {
rbn = el.getElementsByTagName("input")[0].name;
rbn = document.getElementsByName(rbn);
for (i=0;i<rbn.length;i++) {
rbn[i].checked = false;
rbn[i].parentNode.className = "rbu";
}
el.getElementsByTagName("input")[0].checked = true;
el.className = "rbc";
}
</script>
<style type="text/css">
.rbc {width:14px;height:13px;background:url(http://web-tourist.net/userfiles/2/2508.png) no-repeat;cursor:pointer;}
.rbu {width:14px;height:13px;background:url(http://web-tourist.net/userfiles/2/2509.png) no-repeat;cursor:pointer;}
.rbc input,.rbu input {display:none;}
</style>
<form>
<div class="rbc" onclick="rbcc(this)"><input type="radio" name="rb" value="purvi" checked="checked" /></div>
<div class="rbu" onclick="rbcc(this)"><input type="radio" name="rb" value="vtori" /></div>
<div class="rbu" onclick="rbcc(this)"><input type="radio" name="rb" value="treti" /></div>
</form>