码迷,mamicode.com
首页 > Web开发 > 详细

CSS中`nav ul li ul` 与 `nav>ul>li` 这两种写法的区别是什么

时间:2017-10-27 10:24:22      阅读:239      评论:0      收藏:0      [点我收藏+]

标签:级别   顺序   div   包含   class   两种   nbsp   strong   -name   

>是指只能一代接一代,比如: nav>ul>li>ul>li,必须是下面这样的

            <nav>
                <ul>
                    <li>
                        <ul>
                            <li></li>
                        </ul>
                    </li>
                </ul>
            </nav>

然后nav ul li ul只要求后面的元素是在nav标签下的顺序即可,对中间隔了几层不敏感,比如:

 
            <nav>
                <div>
                    <ul>
                        <div>
                            <a>
                                <li>
                                    <div>
                                        <ul>
                                            <li>
                                            </li>
                                        </ul>
                                    </div>
                                </li>
                            </a>
                        </div>
                    </ul>
                </div>
            </nav>





<nav>
    <ul id="a">
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li>
            <ul id="b">
                <li></li><li></li>
            </ul>
        </li>
        <li>
            <ul id="c">
                <li></li><li></li>
            </ul>
        </li>
    </ul>
</nav>

nav>ul只选择nav下一级里面的ul元素,例如上面dom结构里id为a的ul。
nav ul选择nav内所包含的所有ul元素,例如上面dom结构里面id为a、b、c的全部ul。

nav>ulnav ul限定更严格,必须后面的元素只比前面的低一个级别。

CSS中`nav ul li ul` 与 `nav>ul>li` 这两种写法的区别是什么

标签:级别   顺序   div   包含   class   两种   nbsp   strong   -name   

原文地址:http://www.cnblogs.com/lewenzhong/p/7741802.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!