文档章节

纵向下拉菜单的疑惑

sunshinewyf
 sunshinewyf
发布于 2015/11/30 10:11
字数 284
阅读 44
收藏 0

我也是醉了,原本一个很简单的下拉菜单,也搞了那么久,原因仅仅是加了一个css样式,我之前的代码是这样的:

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>test</title>
    <style type="text/css">
        .parent-menu{
            list-style: none;
            height: 400px;
            width:500px;
            margin:0 auto;
            overflow: hidden;
        }
        .parent-menu li{
            background: #CCC none repeat scroll 0% 0%;
            border-bottom: 1px solid #FFF;
            display: block;
            height: 40px;
            line-height: 40px;
        }
        .parent-menu a{
            display: block;
            width: 100%;

        }
        .child-menu{
            width: 100%;
            display: block;
            list-style: none;
        }
    </style>
</head>
<body>
      <ul>
          <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>
          <li><a href="">目录一</a></li>
      </ul>
    
</body>
</html>

显示的结果是:


找了好久的错误,也没找出来,不知道为什么第一个ul元素不能显示出自己的独立空间出来,即使设置了display:block也不行

最后把.parent-menu li的height样式去掉之后就好了,最后结果如下:


至今也不知道是为啥,望好心人给解答,真心觉得奇怪

© 著作权归作者所有

共有 人打赏支持
sunshinewyf
粉丝 15
博文 97
码字总数 64205
作品 0
武汉
程序员
300+Jquery, CSS, MooTools 和 JS的导航菜单资源(总有一个适合你!)

如果你是网站前端开发人员,那么对你来说,也许做一个漂亮导航菜单会很得心应手。今天为大家总结各种导航菜单的资源,以便让大家的网站前端开发的工作更方便更快速,只要选择现成的例子就可以...

晨曦之光
2012/03/09
0
0
Balsamiq Mockups UI控件名中英文对照

Balsamiq Mockups 是最近两年广受欢迎的互联网产品原型设计工具。虽然这款工具的名字很难读,不过它的易用程度超过了同类的原型工具。Balsamiq Mockups适合绘制早期的产品草图,例如你的灵感...

凯文加内特
2014/04/04
0
0
70+漂亮且极具亲和力的导航菜单设计推荐

网站可用性是任何网站的基本要素,而可用的导航更是网站所必需的要素之一。导航决定了用户如何与网站进行交互。如果没有了可用的导航,那么网站内容就会变得毫无用处。导航菜单应当足够简单以...

晨曦之光
2012/03/09
0
0
一款简洁而高效的Arduino开发工具 - Buddy++

版本更新至:v 1.1.1 beta 更换核心代码编辑器,界面更加友好,支持可视化主题更换,文本样式自定义。 优化编译和烧录功能,提高稳定性和效率。 加入右侧信息栏,提供更友好的控制台信息查阅...

oO咫尺天涯
2017/09/19
0
0
一些必看的jQuery导航插件和教程

导航是一个网站最重要的元素之一,您必须遵循统一的风格来设计您的网站,特别是导航的风格,让用户可以轻松地找到他们想要的内容。这里最大的部分是开发一个菜单,即要直观易用,又要符合你网...

迷路的阿修罗
2010/12/30
0
1

没有更多内容

加载失败,请刷新页面

加载更多

转:XMLHttpRequest2 新技巧

”XMLHttpRequest 的异步调用网上找的例子运行没问题,但稍微改了一点点就报错”InvalidStateError: XMLHttpRequest has an invalid context“。断断续续 搞了3天终于通了,可以接收二进制文...

SamXIAO
16分钟前
0
0
=====D服务器定时任务=====

Linux定时任务 crontab linux系统是有cron这个系统服务来控制的,Liunx系统上包含很多的计划性工作,使用者自己可以设置计划任务,所以linux系统提供了使用者控制计划任务的命令 crontab的启...

覃光林
25分钟前
0
0
xilinx资源

本系列教学视频由赛灵思高级战略应用工程师带领你:从零开始,一步步深入 掌握 HLS 以及 UltraFAST 设计方法,帮助您成为系统设计和算法加速的大拿! http://www.eetrend.com/topics/2018-0...

whoisliang
36分钟前
2
0
企业级开源四层负载均衡解决方案--LVS

网盘链接 企业级开源四层负载均衡解决方案--LVS 本课程将在Linux环境下,学习配置使用LVS,对Web集群和MySQL集群进行负载均衡,并结合利用Keepalived实现负载均衡器的高可用,实现对后端Rea...

qq__2304636824
45分钟前
3
0
Windows上安装Spacemacs

emacs安装 下载地址emacs 安装比较简单,解压后执行\bin\addpm.exe即可 emacs配置 emacs的默认配置文件路径和.emacs.d文件夹都是在Windows主目录下的 C:\Users\Administrator\AppData\Roami...

yxmsw2007
今天
2
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部