快速业务通道

CSS复合选择器:css3让我们选择元素变得越来越简单

作者 佚名技术 来源 CSS技术 浏览 发布时间 2012-02-23

CSS复合选择器:css3让我们选择元素变得越来越简单

首先先看一下基本定义:

复合选择器就是两个或多个基本选择器,通过不同方式连接而成的选择器,主要包括“交集”选择器、“并集”选择器、“后代”选择器。

交集选择器

“交集”复合选择器是由两个选择器直接连接构成,其结果是选中二者各自元素范围的交集。其中第一个必须是标记选择器,第二个必须是类别选择器或者ID选择器。这两个选择器之间不能有空格,必须连续书写。

注意其中第一个必须是标记选择器,如p.class1,但有时候会看到.class1.class2,即2个都是类选择器,在其他浏览器中是允许出现这种情况的,但IE6不兼容。如下表:

两个类选择器的“交集”复合选择器浏览器支持表
Mac: Safari 4.0 支持
Mac: Chrome 5.0 支持
Mac: FireFox 3.6 支持
Mac: Opera 10 支持
Win: FireFox 3.6 支持
Win: Opera 10 支持
Win: IE6 不支持
Win: IE7 支持
Win: IE8 支持

复合选择器的使用

这是个简单的tab菜单:

如下是html代码:

1 2 3 4 5 6 <ul class="nav">     <li class="first"><a href="">节目</a></li>     <li class="current"><a href="">合集</a></li>     <li><a href="">草稿</a></li>     <li class="last"><a href="">项目</a></li> </ul>

为了实现以上效果,我们在css中可以使用复合选择器。

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号