代码如下:
导航条
结果为:
中间空隙很大怎么办?而且margin:0 auto;不能使div居中
回复讨论(解决方案)
1 | <html xmlns= "http://www.w3.org/1999/xhtml" ><head><meta http-equiv= "Content-Type" content= "text/html; charset=utf-8" /><title>导航条</title><style type= "text/css" >body,div,ul,li{padding:0;margin:0 auto;}#nav {width:960px;height:35px;background:#ccc;margin:0 auto;margin-top:40px;}#nav ul{list-style:none;width:960px;height:35px;}#nav ul li{float:left;line-height:35px;text-align:center;font-family:微软雅黑;margin:0px 5px;}#nav ul li a{display:block;font-size:16px;color;#333;text-decoration:none;padding:0px 5px;}#nav ul li a:hover{color:#fff;background:#000;} #nav ul li a.first{margin-left:20px} </style></head><body><center><div id= "nav" ><ul><li><a class = "first" href= "#" >首页</a></li><li><a href= "http://www.csdn.net/" >极客学院</a></li><li><a href= "http://www.csdn.net/" >CSDN博客</a></li><li><a href= "http://www.csdn.net/" >51CTO</a></li><li><a href= "https://github.com/" >GitHub</a></li><li><a href= "http://www.csdn.net/" >北大青鸟</a></li><li><a href= "http://www.csdn.net/" >黑客联盟</a></li></ul></div></center></body></html>
|
Salin selepas log masuk
这么快就搞定了,大神啊