首页 > Web开发 > 详细

css3选择器

时间:2016-01-07 20:09:02      阅读:212      评论:0      收藏:0      [点我收藏+]

一、css3选择器的分类

  css3的选择包含五种选择器:基本选择器、层次选择器、伪类选择器、伪元素、属性选择器,而伪类选择器又分为动态伪类选择器、目标伪类选择器、语言伪类选择器、UI元素状态伪类选择器、结构伪类选择器。如图所示:

  技术分享

   1.1 基本选择器

   技术分享

  兼容性如下:所有浏览器都支持

  1.2 层次选择器

  技术分享

  浏览器兼容性:IE7+、google、firefox、opera、safari

 1.3  动态伪类选择器

  技术分享

  规则:LoVe/HAte:也就是:link - :visited - :hover - :active

  浏览器兼容:ie8+、google、firefox、opera、safari,a标签ie8以下兼容

 1.4 目标伪类选择器

  E:target   选择匹配E的所有元素,且匹配元素被相关URL指向

  浏览器兼容:ie9+、google、firefox、opera、safari,a标签ie8以下兼容

 1.5 语言伪类选择器

  E:lang   选择匹配E的所有元素,且匹配元素指定了lang属性,其值为language

  浏览器兼容:ie8+、google、firefox、opera 9.2+、safari,a标签ie8以下兼容

  1.6 UI状态伪类选择器

  技术分享

  浏览器兼容:ie9+、google、firefox、opera 9.2+、safari

  1.7 结构伪类选择器

  技术分享

  注:选择器参数n可以是整数(1、2、3、4)、关键字(odd、even)、表达式(2n+1)

  浏览器兼容:ie9+、google、firefox、opera、safari

  1.8 否定伪类选择器

  技术分享

  浏览器兼容:ie9+、google、firefox、opera 9.2+、safari

 1.9 伪元素

  ::first-letter 用来选择块的第一个字母,例如实现首字母下沉

  ::first-line 用来匹配第一行文本

  ::before与::after 可以插入额外内容的元素 例如运用于字体

  ::selection 用来匹配突出显示的文本

 1.10 属性选择器

技术分享

浏览器兼容:ie7+、google、firefox、opera、safari

css3选择器

原文:http://www.cnblogs.com/sanbao/p/5110192.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!