float：left 求解_html/css_WEB-ITnose
- WBOY原创
- 2016-06-24 11:46:07935浏览
http://paste.ubuntu.com/10826550/
这个怎么让他浮动啊，他怎么加了float：left之后怎么不浮动？
回复讨论(解决方案)
就是想让li元素横放在一起。但是给li加了浮动之后，就第一个个浮动了
好吧，明白了，宽度不够
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>列表模式的导航</title><style type="text/css">.site_nav { width:800px; }.site_nav h1 { display:none; }#nav ul, #nav li { list-style:none; padding:0; margin:0;}#nav li { height:22px;float:left;}#nav li a { display:block; height:100%; text-align:center; text-decoration:none; font:normal 12px/22px "宋体", Verdana,Lucida, Arial, Helvetica, sans-serif; color:#FFFFFF; background-color:#333333;}#nav li a:hover { color:#000000; background-color:#E8E8E8;}</style></head><body><div class="site_nav"> <h1>站点导航</h1> <map id="nav"> <ul> <li><a href="#">首页</a></li> <li><a href="#">个人介绍</a></li> <li><a href="#">作品展示</a></li> <li><a href="#">联系我们</a></li> </ul> </map></div></body></html> 有两处少了“}”
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>列表模式的导航</title><style type="text/css">.site_nav { width:400px; }.site_nav h1 { display:none; }#nav ul, #nav li { list-style:none; padding:0; margin:0;}#nav li { float: left; height:22px; }#nav li a { padding: 0px 5px; display:block; height:100%; text-align:center; text-decoration:none; font:normal 12px/22px "宋体", Verdana,Lucida, Arial, Helvetica, sans-serif; color:#FFFFFF; background-color:#333333;}#nav li a:hover { color:#000000; background-color:#E8E8E8;}</style></head><body><div class="site_nav"> <h1>站点导航</h1> <map id="nav"> <ul> <li><a href="#">首页</a></li> <li><a href="#">个人介绍</a></li> <li><a href="#">作品展示</a></li> <li><a href="#">联系我们</a></li> </ul> </map></div></body></html> 声明：
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn