我有一个工作正常的页面布局,它是我不想弄乱的(除非我必须这样做)。我不擅长javascript,所以我在网上找到了一个例子。我遇到的问题是,当使用手风琴菜单时,子菜单向右偏移。我在 html 本身中使用了一些内联 CSS,并使用!important
命令覆盖列表元素上的自动填充。这似乎没有任何效果。JS在这里摆弄。那里有大量自动生成的注释代码,所以会很混乱,我只需要所有这些代码来展示手风琴子菜单的示例。为什么内联 CSS 不覆盖外部 CSS 文件?为什么!important
关键字不起作用?
我以为有一些填充,但
ul {
padding: 0;
margin: 0;
}
在我的外部 CSS 文件中,并且填充显然设置为 0。
这是使手风琴工作的CSS。
<style type="text/css">
#accordionNav {
float: left;
width: 560px;
list-style:none;
padding:none;
}
#accordionNav li a {
display: block;
padding:5px;
background: #ccc;
border-top: 1px solid #eee;
border-bottom: 1px solid #999;
text-decoration: none;
color: #000;
list-style:none;
padding:none !important;
width: 560px;
}
#accordionNav li a:hover, #accordionNav li a.active {
background: #999;
color: #fff;
}
#accordionNav li ul {
display: none;
list-style:none;
padding:none !important;
}
#accordionNav li ul li a {
padding:0 0 0;
background: #ececec;
list-style:none;
padding:none !important;
}
知道是什么导致子菜单无法正确对齐吗?