li 写在 ul 前面的 CSS 写法是啥意思?

2015-08-05 16:53:43 +08:00
 1dian01
.main-navigation .menu li ul {
visibility: hidden;
background: #ffffff;
text-align: left;
padding: 7px 0px;
margin: 0;
position: absolute;
left: 0;
top: 120%;
width: 200px;
z-index: 999;
opacity: 0;
filter: alpha(opacity=0);
-webkit-transition: all 0.2s ease;
-o-transition: all 0.2s ease;
transition: all 0.2s ease;
}
2368 次点击
所在节点    问与答
11 条回复
a591826944
2015-08-05 16:58:53 +08:00
二级以及二级以后的菜单项
TakanashiAzusa
2015-08-05 17:08:04 +08:00
@a591826944 li后面找不到ul啊。。还是说他的HTML是
ul>li>ul
这样?
lichao
2015-08-05 17:09:48 +08:00
@TakanashiAzusa 对了,就是列表中再嵌套列表
haiyang416
2015-08-05 17:12:34 +08:00
列表嵌套,很正常的情况,一般前端框架中的 subnav 都是这样的。
blacktulip
2015-08-05 17:15:27 +08:00
嵌套咯,可以一层套一层
1dian01
2015-08-05 17:17:48 +08:00
问题是html是这样的,下面没有 ul了

<!-- start navigation -->
<nav class="main-navigation">
<div class="container">
<div class="row">
<div class="col-sm-12">
<div class="navbar-header">
<span class="nav-toggle-button collapsed" data-toggle="collapse" data-target="#main-menu">
<span class="sr-only">Toggle navigation</span>
<i class="fa fa-bars"></i>
</span>
</div>
<div class="collapse navbar-collapse" id="main-menu">
<ul class="menu">
<li class="nav-current" role="presentation"><a href="/">首页</a></li>
<li role="presentation"><a href="http://wenda.ghostchina.com">论坛</a></li>
<li role="presentation"><a href="/ghost-cheat-sheet/">快捷手册</a></li>
<li role="presentation"><a href="http://docs.ghostchina.com/zh/">中文文档</a></li>
<li role="presentation"><a href="/download/">下载</a></li>
<li role="presentation"><a href="/about/">关于</a></li>
</ul>
</div>
</div>
</div>
</div>
</nav>
<!-- end navigation -->
1dian01
2015-08-05 17:20:07 +08:00
@blacktulip
@haiyang416
@lichao
@TakanashiAzusa
@a591826944
上面加上了html部分,li下面没有ul了,咋嵌套呢?

http://www.ghostchina.com/ 这个网站
lingyired
2015-08-05 17:25:37 +08:00
@1dian01

当前网站的需求里面不需要二次菜单嵌套。
但是这个模版/主题支持这种的嵌套。
gongpeione
2015-08-05 17:27:59 +08:00
他只是没加二级菜单而已,你自己 f12 在某一个li里嵌套一个ul就可以看到效果了
LancerComet
2015-08-05 17:28:33 +08:00
只说这个问题,这个是为嵌套列表准备的,只是当前 HTML 里没有用到嵌套列表而已。
blacktulip
2015-08-05 18:15:00 +08:00
@1dian01 css 里面有但是 html 里面不一定要用...

这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。

https://www.v2ex.com/t/211024

V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。

V2EX is a community of developers, designers and creative people.

© 2021 V2EX