不用JavaScript实现内容切换效果代码

作者：简简单单 2013-09-30

提示：您可以先修改部分代码再运行

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title> JavaScript实现内容切换效果 </title>
    <style type="text/<a href="http://www.111com.net/cssdiv/css.html" target="_blank">css</a>">
    *{margin:0;padding:0;}
	body{font:12px/1.5 tahoma, arial, 5b8b4f53, sans-serif;}
    ul, ol {list-style: none; }
    a {text-decoration: none; }
    a:hover {text-decoration:underline; }
    img {border:0;}
	
	.section{ margin:0 auto; }
	
	#content-slider{border:1px solid #666; margin-top:50px;}
	#content-slider-inside{overflow:hidden; }
	#content-slider-inside li{background-color:#ccc;text-align:center;font-size:100px;line-color:#666;}
	
	#navigation {margin: 10px 0 0 0;float: right;}
	#navigation li {border:solid 1px #ccc; float:left;line-text-align:center;margin-left:5px;}
	#navigation li a, #navigation li a:link, #navigation li a:visited {color: #666;display: block;}
	#navigation li a:hover, #navigation li a:focus, #navigation li a:active {background:#666;color:#fff;}

</style>
</head>

<body>

</body>
</html></td>
	  </tr>
	</table>

提示：您可以先修改部分代码再运行

上一个：CSS中未知高度水平垂直居中实例下一个：js 三级地市联动菜单演示效果代码