博客园  :: 首页  :: 新随笔  :: 联系 :: 订阅 订阅  :: 管理

CSS子选择器

Posted on 2011-08-29 14:31  southy  阅读(258)  评论(1)    收藏  举报

在CSS的选择器中还有一种十分有用的子选择器，它用来选择一个父元素直接的子元素，不包括子元素的子元素，她的符号为大于好">"。


<html>
<head>
<title>CSS的子选择器</title>
<style type="text/css">
ul.myList > li > a{            /* 子选择器 */
    text-decoration:none;    /* 没有下划线 */
    color:#336600;
}
</style>
</head>

<body>
<ul class="myList">
    <li>
      <a href="http://www.southy.cn/">southy.cn</a>
        <ul>
            <li><a href="#">CSS1</a></li>
            <li><a href="#">CSS2</a></li>
            <li><a href="#">CSS3</a></li>
        </ul>
    </li>
</ul>
</body>
</html>


效果各位自己测试看看，如果去掉“>",在测试下，会发现中间的差别。 


原文出自：http://www.southy.cn/article.asp?id=81