How to create Stylish Select-box,Radio button,Checkbox

Stylish Select-box

HTML

[java]
<select class="selectBox">
<option>Select</option>
<option>New Delhi</option>
<option>Mumbai</option>
</select>
[/java]

CSS

[java]
.selectBox{
appearance: none;-webkite-appearance: none;-moz-appearance: none;-o-appearance: none;-ms-appearance: none;
background: #f5f5f5 url(‘image-path’) no-repeat right center;
border: 1px solid #eeeeee;
width:300px;
height:40;
padding:10px;
}
[/java]

Stylish Radio button

HTML

[java]
<input type="radio" value="" class="radioBtn"/><label></label>
[/java]

CSS

[java]
.radioBtn {
vertical-align: middle;
width: 15px;
height: 15px;
opacity: 0;
}

.radioBtn + label:before {
content: "";
display: inline-block;
margin: 0 0 0 -20px;
vertical-align: middle;
height: 15px;
width: 15px;
background: url(‘image-path’) no-repeat left top;
}

.radioBtn:checked + label:before {
background-position: left bottom;
}
[/java]

Stylish Checkbox

HTML

[java]
<input type="checkbox" value="" class="checkboxBtn"/><label></label>
[/java]

CSS

[java]
.checkboxBtn {
vertical-align: middle;
width: 15px;
height: 15px;
opacity: 0;
}

.checkboxBtn + label:before {
content: "";
display: inline-block;
margin: 0 0 0 -20px;
vertical-align: middle;
height: 15px;
width: 15px;
background: url(‘image-path’) no-repeat left top;
}

.checkboxBtn:checked + label:before {
background-position: left bottom;
}
[/java]

Note :-As per requirements You Can change background,border,width,height.