IT兄弟连 HTML5教程 CSS3揭秘 CSS选择器1
要使用CSS对HTML页面中的元素实现一对一、一对多或者多对一的控制，就需要用到CSS选择器。选择器是CSS3中一个重要的内容，使用它可以大幅度地提高开发人员书写或修改样式表的效率。在大型网站中，样式表中的代码可能会达到几千行，而当我们需要对样式进行修改时，并没有说明什么样式服务于什么元素，只是在元素中使用了class属性。而class属性本身没有语义，它纯粹是用来为CSS服务的，属于多余属性。CSS3提倡使用选择器来将样式与元素直接绑定起来，这样一来，在样式中什么样式与什么元素相匹配就变得一目了然，修改起来也很方便。不仅如此，通过选择器我们还可以实现各种复杂的指定，同时也能大量减少样式表的代码书写量，使得最终书写出来的样式表变得简洁明了。
1 基本选择器
CSS是一种用于屏幕上渲染HTML的语言，它主要是在相应的元素中应用样式来渲染相对应的元素，那么如何选择相应的元素就显得很重要了。这时可以应用选择器。选择器主要用来确定HTML的树形结构中的DOM元素节点。可以把CSS选择器分为基本选择器、属性选择器、伪类选择器等几个部分。基本选择器如表1所示。
表1 CSS3基本选择器及实例
2 多元素的组合选择器
多个选择器可以组合在一起使用，其组合形式有多种，包括多元素选择器、后代元素选择器、子元素选择器、毗邻元素选择器、同级元素通用选择器5种类型，如表2所示。
表2 CSS3多元素的组合选择器及实例
3 属性选择器
属性选择器可以根据元素的属性及属性值来选择元素。如果希望选择具有某个属性的元素，而不论属性值是什么，可以使用简单属性选择器。在CSS2.1中就引入了一些属性选择器，如表3所示。
表3 CSS2.1属性选择器及实例
在CSS3中增加了一些属性选择器，使用CSS3的属性选择器，既可以只指定元素的某个属性，也可以同时指定元素的某个属性及其对应的属性值。CSS3的属性选择器如表4所示。
表4 CSS3属性选择器及实例
最新文章
- Two Sum Leetcode Java
- MVC前台页面做登录验证
- java中快速排序的理解以及实例
- Web 在线文件管理器学习笔记与总结（17）复制文件 （18）剪切文件
- SQLServer学习笔记<>sql的范围内查找，sql数据类型，字符串处理函数
- java多线程总结五：线程池的原理及实现
- tar打包和解压命令
- asp.net redis 实战
- Newtonsoft.Json 将C#对象转化为json格式
- select、poll、epoll之间的区别总结[转]
- 后端分布式系列：分布式存储－HDFS NameNode 设计实现解析
- UnityInspector显示扩展
- Coroutine的原理以及实现
- BZOJ4858 : [Jsoi2016]炸弹攻击 2
- java 安装环境 疑问（1）
- 09-01 Java final，多态，抽象类，接口
- 复杂json的解析：jsonobject与jsonArray的使用
- 【刷题】BZOJ 4946 [Noi2017]蔬菜
- 自定义 Core Data 迁移
- GraphQL：一种不同于REST的接口风格