首页 > 代码库 > CSS3选择器随笔

CSS3选择器随笔

CSS 选择器缺点:

1, class属性本身没有语义,纯粹用来为CSS样式服务的,属于多余属性;

2,使用class属性的话,并没有把样式与元素绑定起来,这样会非常混乱,修改样式的时候也不方便.

so,在css3中,提倡使用选择器来将样式与元素直接绑定起来,在样式表中什么样式与什么元素相匹配变得一目了然,修改起来会更方便.更方便的是我们可以实现各种复杂的指定,同时,也能大量减少样式表的代码书写量,使书写出来的样式表变得简洁明了.

例如,我们可以指定将页面中id为"div_Big"的div元素的别净设定为红色,代码表示为:div[id="div_Big"] {background: red;}

so,符合这个条件(id为"div_Big") 的div元素的背景色会被设计为红色,不符合这个条件的div元素则不使用这个样式.

另外,我们还可以在指定样式的时候使用 "^" 通配符 (开头字符匹配) , "?" 通配符 (结尾字符匹配) 与 "*" 通配符 (包含字符匹配). 比如指定id末尾字母为 "t" 的div元素的背景色为蓝色,代码如下所示:

div[id$="t"] {background: red;} 

通过通配符的使用,更加提高了样式的书写效率.

CSS3选择器随笔