css3叫做样式表  对页面的布局,字体,颜色,背景和其他效果做更精确的布置

支持的浏览器有 chrome safari firfox opera 甚至360都开始支持360用的是别的内核 IE10 之后也开始支持
不通过的浏览器需要不同的前缀 表示浏览器尚未成为w3c标准的一部分是浏览器的私有属性,虽然现在较新的浏览器都不需要前缀,但是为拉更好的向前兼容前缀还是少不了的

引入,  link标签引入  在html中style标签内嵌    在body的标签中直接内联

属性选择器

div标签中属性为id的结尾有x的值 全部被选中

所有div标签中带有id属性的,属性值中包含box的,全部被选中

所有div标签中带有id属性的, 属性值中以box为开头的全部被选中

所有div标签中带有id属性的, 属性值必须等于box

结构性选择器

匹配文档的根元素,一般都是指的html

相邻兄弟选择器,向下查找同级的第一个span标签

:first-child第一个子元素

:last-child最后一个子元素

选取列表中的奇数偶数个

div向下所有兄弟标签为span的必须是同级

li中第5个子元素   冒号前面不能有空格

选择倍数 4*n+1  是5的倍数

否定伪类选择器  除啦id=box以外的其他的  全部选中

匹配没有任何元的的

:first-of-type:相同类型中的第一个li元素

:last-of-type相同类型中的最后一个li元素
:only-of-type唯一一个同级兄弟元素
:nth-of-type(n)第几个

UI选择器

很少一部分浏览器支持
 用鼠标选中的部分进行改变

用户界面上处于禁用状态的,不可以点击和选中的

匹配用户页面状态上可用的状态,可以点击选中和输入的

伪对象选择器

部分选择器的兼容性还不是很完善
前缀兼容:浏览器自身能支持才行, 部分属性和选择器浏览器就不支持加前缀也没有效果

1,不加前缀 用双冒号单冒号都行

2,-moz-火狐中加前缀可以使用

3,欧朋不支持,加前缀也不支持-O-

总结

CSS 3 选择器的更多相关文章

  1. CSS的选择器

    <div id="demo"> <div class="inner"> <p><a href="#" ...

  2. JS实战 · 仿css样式选择器

    代码如下: <html> <head>     <meta http-equiv="Content-Type" content="text/ ...

  3. CSS 后代选择器

    后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...

  4. css后代选择器(div.class中间不带空格)

    如果我要查找<div>上用了.class的元素,查找方法:div.class:中间是不空格的. 以上这种形式为css后代选择器 参考:http://www.w3school.com.cn/ ...

  5. CSS样式选择器优先级

    CSS样式选择器分为4个等级,a.b.c.d,可以以这四种等级为依据确定CSS选择器的优先级. 1.如果样式是行内样式(通过Style=””定义),那么a=12.b为ID选择器的总数3.c为Class ...

  6. css中选择器的使用

    css是英文Cascading Style Sheets的缩写.它是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言.我们再将html比喻 ...

  7. CSS 派生选择器

    派生选择器 通过依据元素在其位置的上下文关系来定义样式,你可以使标记更加简洁. 在 CSS1 中,通过这种方式来应用规则的选择器被称为上下文选择器 (contextual selectors),这是由 ...

  8. CSS 类选择器

    在 CSS 中,类选择器以一个点号显示: .center {text-align: center} 在上面的例子中,所有拥有 center 类的 HTML 元素均为居中. 在下面的 HTML 代码中, ...

  9. CSS id 选择器

    id 选择器 id 选择器可以为标有特定 id 的 HTML 元素指定特定的样式. id 选择器以 "#" 来定义. 下面的两个 id 选择器,第一个可以定义元素的颜色为红色,第二 ...

  10. CSS类选择器和ID选择器

    CSS类选择器和ID选择器皆允许以一种独立于文档元素的方式来指定样式,同时二者皆区分大小写. 区别如下: 第一:在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class 第二:当页 ...

随机推荐

  1. python Shapely 使用指南

    翻译:http://toblerity.org/shapely/manual.html 引入包 from shapely.geometry import Point from shapely.geom ...

  2. RDIFramework.NET ━ 9.9 角色权限管理 ━ Web部分

    RDIFramework.NET ━ .NET快速信息化系统开发框架 9.9  角色权限管理 -Web部分 角色权限管理模块主要是对角色的相应权限进行集中设置.在角色权限管理模块中,管理员可以添加或移 ...

  3. (转载)移动WEB前端开发资源整合

    收藏起来,感谢原文大大:Bon~~~ 原文链接:http://www.ccwebsite.com/development-of-resource-integration-in-mobile-termi ...

  4. 微信的redirect_uri参数错误原因分析

    我们可以根据微信的开发者文档  http://mp.weixin.qq.com/wiki/17/c0f37d5704f0b64713d5d2c37b468d75.html 网页授权获取用户验证这一章来 ...

  5. Velocity(8)——引入指令和#Stop指令

    #Include和#Parse都是用于将本地文件引入当前文件的指令,而且被引入的文件必须位于TEMPLATE_ROOT.这两者之间有一些区别. #Include 被#Include引入的文件,其内容不 ...

  6. cat常用参数详解

    cat常用参数详解 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 最近,我的一个朋友对linux特别感兴趣,于是我觉得每天交给他一个命令的使用,这样一个月下来也会使用30个命令,基 ...

  7. SVN----------项目服务器上的svn客户端自动更新设置。

    1.局域网服务器上搭建了PHP项目运行的环境,然后怎么样讲根目录拉去到的项目可以随着开发人员提交的代码,自动更新成最新的代码. 2.首先将svn版本库上的代码拉取到www目录下或者你的根目录. 3.然 ...

  8. C++复现经典游戏——扫雷

    国庆小长假,当大家都去看人山人海的时候,我独自一人狂码代码.这两天想要实现的内容是Windows上的一个经典游戏——扫雷.相信90后和一些上班族对此并不陌生.然而,从win8开始,扫雷就不再是Wind ...

  9. 批处理命令——set

    [1]set命令简介 set,设置. [2]set命令使用 1. 打印系统环境变量.set命令可以打印系统所有的环境变量信息. 应用示例:新建文本文件,命名为set_sys,修改文件类型为bat,用N ...

  10. java—数组乘积输入: 一个长度为n的整数数组input 输出: 一个长度为n的数组result,满足result[i] = input数组中,除了input[i] 之外的所有数的乘积,不用考虑溢出例如 input {2, 3, 4, 5} output: {60, 40, 30, 24}

    /** * 小米关于小米笔试题 数组乘积输入: 一个长度为n的整数数组input 输出: 一个长度为n的数组result,满足result[i] = * input数组中,除了input[i] 之外的 ...