<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jQuery自定义单选按钮复选框样式特效</title>
<script src="js/jquery-1.8.3.min.js"></script>
<link rel='stylesheet' text="type/css" href="css/input.css">
<style>
body{padding: 20px}
</style>
</head>
<body><script src="/demos/googlegg.js"></script>
<center>
<form>
<p>
单选框
<lable>
<i class='input_style radio_bg'><input type="radio" name="hot" value="1"></i>
a1
</lable>
<lable>
<i class='input_style radio_bg'><input type="radio" name="hot" value="2"></i>
a2
</lable>
<lable>
<i class='input_style radio_bg'><input type="radio" name="hot" value="3"></i>
a3
</lable>
<lable>
<i class='input_style radio_bg'><input type="radio" name="hot" value="4"></i>
a4
</lable>
<lable>
<i class='input_style radio_bg'><input type="radio" name="hot" value="5"></i>
a5
</lable>
</p>
<p>
复选框
<lable>
<i class='input_style checkbox_bg'><input type="checkbox" name="q" value="11"></i>
b1
</lable>
<lable>
<i class='input_style checkbox_bg'><input type="checkbox" name="w" value="22"></i>
b2
</lable>
<lable>
<i class='input_style checkbox_bg'><input type="checkbox" name="e" value="33"></i>
b3
</lable>
<lable>
<i class='input_style checkbox_bg'><input type="checkbox" name="r" value="44"></i>
b4
</lable>
</p>
<input type="submit" value="提交">
</form>
<script text="type/javascript" src="js/input.js"></script>
</center>
<div style="text-align:center;margin:150px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
<p>更多源码下载:<a href="http://www.96flw.com" target="_blank">www.96flw.com</a></p>
</div>
</body>
</html>