轮播图这东西，我相信只要是做前端的，肯定都做过，不过大部分应该都是用js来实现的，其实css3也是可以实现轮播图的，而且也可以加一些动画之类的，下边就分享下思路。声明，这里没有贬低 js 的意思，相反， js 能做的， css 基本做不到， css 能做的， js 基本能做到，这里纯粹就是为了分享 css 的一些运用。
css 里有个可以绑定到 <input>上的标签 <label>，它的功能就是当你点击所绑定的这个 <label>的时候，就可以选中相应的 <input>，既然有了这个功能，那就有了控制轮播图的方法了。
通过 css 可以看到，其实这个例子主要用到的就是 <input type="radio">的 :checked 伪类选择器然后通错 css3 的 :nth-of-type(n) 节点选择器控制与之相对应的轮播、按钮，整个例子也没什么难度，也就不废话了。
如果你确认这不是系统内置的样式功能，比如window的主题，那就是js控制的模拟radioradio本身是不能由css随意改变样式的，但一定程度上的美化还是可以的，背景色啥的还是有可能嵌套进去的。
如果要使 单选框选中 需要该复选框的属性 checked 的值为 "checked" 而不是 true
$("#rdo1").attr("checked","checked")
还有一点要注意的是 如果要使 复选框 变成没有选中 的话 需要移除checked 属性 或者 checked的属性为false
$("#rdo1").removeAttr("checked")
或者
$("#rdo1").attr("checked","false")
就是说 只有checked的属性 为"checked" 时 才是选中状态
还有 一组radio（即name属相相同的radio）只能有一个处于选中状态、查看一下你的其他组的radio是不是name属性设置重复了。
所以你的代码改为 $("#rdo1").attr("checked","checked") 就可以了,下面一段简单示例代码
页面装载完成后把选项2 选中.
<html><script type="text/javascript" src="./jsfile/jquery-1.10.2.min.js"></script>
<script>
onload = function (){ // 装载完成时执行
alert()
$("input[name='vehicle']").eq(0).removeAttr("checked")
$("input[name='vehicle']").eq(1).attr("checked","checked")
}
</script>
<body>
<form action="form_action.asp" method="get">
<input type="radio" id ="rd1" name="vehicle" value="Car" /> I have a car
<input type="radio" id ="rd1" name="vehicle" value="bus" /> I have a bus
</form>
</body>
</html>
