为了账号安全,请及时绑定邮箱和手机立即绑定

为什么二级菜单 li 宽度不自适应,希望能粘贴到你们的DW里面试下,麻烦各位了

大家帮我看戏哪里不对呀?



<!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=utf-8" />

<title>无标题文档</title>

<STYLE type="text/css">

*{ margin:0px; padding:0px;}

#nav{ width:600px; height:40px; background:#999; margin:0px auto;}

ul{ list-style:none;}

ul li{ float: left; line-height:40px; text-align:center; position:relative;}

ul li a{ text-decoration:none; color:#000; display:block; padding:0px 10px; }

ul li a:hover{ color:#FFF; background:#9c3;}

ul li ul{ position:absolute; left:0px; top:40px;}

ul li ul li{ float: none; background:#999; margin-top:2px;}

ul li ul li a:hover{ color:#FFF; background:#9c3;}

</STYLE>

</head>



<body>

<div id="nav">

<ul>

  <li><a href="#">首页</a></li>

  <li><a href="#">公司简介</a>

        <ul>

          <li><a href="#">第一节课人很学习</a></li>

          <li><a href="#">第一节课</a></li>

          <li><a href="#">第一节课</a></li>

          <li><a href="#">第一节课</a></li>

        </ul>

  </li>

  <li><a href="#">产品介绍</a></li>

  <li><a href="#">联系方式</a></li>

</ul>

</div>


</body>

</html>


正在回答

4 回答

好像就汉字会自动分行,英文不会,有大神知道啥原因,整了半天

0 回复 有任何疑惑可以回复我~
#1

不含糖

为什么啊!!!!!!
2015-11-17 回复 有任何疑惑可以回复我~

设置此属性值为 absolute 会将对象拖离出正常的文档流绝对定位而不考虑它周围内容的布局,此时的子元素只会受制于父元素的宽度,是不会影响到父元素的变化

0 回复 有任何疑惑可以回复我~

http://www.imooc.com/wenda/detail/240375

0 回复 有任何疑惑可以回复我~

5490563a0001d5fe05000239.jpg

为什么二级菜单li宽度不自适应呢?麻烦各位告诉我下。。。小弟谢谢了

0 回复 有任何疑惑可以回复我~
#1

圆儿 提问者

真的没人帮我吗,好郁闷呀
2014-12-17 回复 有任何疑惑可以回复我~
#2

用户1149621

用padding属性,不要用width
2015-01-05 回复 有任何疑惑可以回复我~
#3

傲娇的向日葵 回复 圆儿 提问者

试试这个ul li ul li a{ padding:0 10px;}
2015-03-11 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消
形形色色的下拉菜单
  • 参与学习       106972    人
  • 解答问题       543    个

本教程从易到难,循循渐进,运用不同技术实现动态下拉菜单

进入课程

为什么二级菜单 li 宽度不自适应,希望能粘贴到你们的DW里面试下,麻烦各位了

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信