HTML主要包括了3个主要部分：radio按钮和标签，容器，及其标题，如下：
<section class="cr-container">
<!-- radio buttons and labels -->
<input id="select-img-1" name="radio-set-1" type="radio" class="cr-selector-img-1" checked/>
<label for="select-img-1" class="cr-label-img-1">1</label>
<input id="select-img-2" name="radio-set-1" type="radio" class="cr-selector-img-2" />
<label for="select-img-2" class="cr-label-img-2">2</label>
<input id="select-img-3" name="radio-set-1" type="radio" class="cr-selector-img-3" />
<label for="select-img-3" class="cr-label-img-3">3</label>
<input id="select-img-4" name="radio-set-1" type="radio" class="cr-selector-img-4" />
<label for="select-img-4" class="cr-label-img-4">4</label>
<div class="clr"></div>
直接CSS是写不出来的，因为幻灯片是在一定时间之后做一个动画移动。不过，用CSS3可以实现，只是浏览器的兼容性不好。
其实，这个本身就是JS的事情，为什么非得用CSS来做呢。
不求兼容性的话 jQuery+CSS3 就可以比较轻松的实现，如果要兼容性的话就需要比较大量的 JS 代码了，CSS3 兼容性还是不佳，不过目前来看，win xp 的退役导致 ie6和7 的份额大幅下跌，如果从 ie8 开始考虑的话 CSS3 也是不错的选择，如果你想免费、轻松、高效的学习上边提到的技术可以到Web沙龙论坛（百度一下），里边有很多类似的教程，和前辈交流经验，共同进步，祝你早日成功！
