css选择器的优先级:作用的元素一样,样式一样,就会有优先级问题。
* 通配选择器 0
* 标签名选择器 1
* 类选择器 10
* id选择器 100
* 后代选择器 选择器1 选择器2 ...(会有相加的过程)
* 群组选择器 选择器1,选择器2,... (不会有相加的过程)
注意:
* 1.相同类型的选择器 样式冲突下 后覆盖前
* 2.不同类型的选择器 样式冲突下 优先级高覆盖优先级低
* 3.* <Tags <class <id <style <!important
* 4.!important慎用(非得用的时候,要加注释说明一下)
#div:not(':last-child')
选择id=div的除了最后一个子元素以外的所有子元素
#div:not(p)选择id=div的元素下所有不是p元素的子元素
标准通用标记语言下的一个应用HTML标准自1999年12月发布的HTML4.01后,后继的HTML5和其它标准被束之高阁,为了推动Web标准化运动的发展,一些公司联合起来,成立了一个叫做WebHypertextApplicationTechnologyWorkingGroup(Web超文本应用技术工作组-WHATWG)的组织。WHATWG致力于Web表单和应用程序,而W3C(WorldWideWebConsortium,万维网联盟)专注于XHTML2.0。在2006年,双方决定进行合作,来创建一个新版本的HTML。
HTML5草案的前身名为WebApplications1.0,于2004年被WHATWG提出,于2007年被W3C接纳,并成立了新的HTML工作团队。
HTML5的第一份正式草案已于2008年1月22日公布。HTML5仍处于完善之中。然而,大部分现代浏览器已经具备了某些HTML5支持。
2012年12月17日,万维网联盟(W3C)正式宣布凝结了大量网络工作者心血的HTML5规范已经正式定稿。根据W3C的发言稿称:“HTML5是开放的Web网络平台的奠基石。”
2013年5月6日,HTML5.1正式草案公布。该规范定义了第五次重大版本,第一次要修订万维网的核心语言:超文本标记语言(HTML)。在这个版本中,新功能不断推出,以帮助Web应用程序的作者,努力提高新元素互操作性。
本次草案的发布,从2012年12月27日至今,进行了多达近百项的修改,包括HTML和XHTML的标签,相关的API、Canvas等,同时HTML5的图像img标签及svg也进行了改进,性能得到进一步提升。
支持Html5的浏览器包括Firefox(火狐浏览器),IE9及其更高版本,Chrome(谷歌浏览器),Safari,Opera等;国内的傲游浏览器(Maxthon),以及基于IE或Chromium(Chrome的工程版或称实验版)所推出的360浏览器、搜狗浏览器、QQ浏览器、猎豹浏览器等国产浏览器同样具备支持HTML5的能力。
CSS3 选择器大概有一下几个类型:
全局选择器 Universal Selector
类型选择器 Type Selector
属性选择器 Attribute Selectors
伪类 Pseudo-classes
伪元素 Pseudo-element
Class 选择器 Class Selectors
ID 选择器 ID Selectors
选择符 Combinator
下面是 W3C 官网上关于 Selector Level 3 的一个表格。我翻译了一下。
不同浏览器对 CSS 选择器有不同程度的支持,目前的浏览器(IE9前除外)已经支持了下面的绝大部分选择器。
* 任何元素
E 一个 E 类型的元素
E[foo] 拥有“foo”属性的E 元素
E[foo="bar"] 拥有属性值等于“bar”的“foo”属性的 E 元素
E[foo~="bar"] 一个 E 元素,它的“foo”属性值是通过空格分开的一系列的值,其中有一个值等于“bar”
E[foo^="bar"] 一个 E 元素,它的“foo”属性的值是一个以“bar”开头的字符串
E[foo$="bar"] 一个 E 元素,它的“foo”属性的值是一个以“bar”结尾的字符串
E[foo*="bar"] 一个 E 元素,它的“foo”属性值包含字符串“bar”
E[foo|="en"] 一个 E 元素,它的“foo”属性的值是通过连字符(-)分割的一系列的值的字符串,其中有一个值是以“en”开头
E:root 一个 E 元素,是文档的根元素
E:nth-child(n) 一个 E 元素,是它父元素的第 n 个子元素
E:nth-last-child(n) 一个 E 元素,是它父元素的倒数第 n 个子元素
E:nth-of-type(n) 一个 E 元素,在它同类型的兄弟元素中排在第 n 个
E:nth-last-of-type(n) 一个 E 元素,在它同类型的兄弟元素中排行倒数第 n 个
E:first-child 一个 E 元素,是它父元素的第一个子元素
E:last-child 一个 E 元素,是它父元素的最后一个子元素
E:first-of-type 一个 E 元素,是它同类型兄弟元素中的第一个
E:last-of-type 一个 E 元素,是它同类型的兄弟元素中的最后一个
E:only-child 一个 E 元素,是它父元素的唯一一个子元素
E:only-of-type 一个 E 元素,是它同类型的兄弟元素的唯一一个(没有别的同类的兄弟)
E:empty 一个没有子元素的 E 元素
E:link 一个没有被访问过的,作为超链接的锚点的 E 元素
E:visited 一个被访问过的锚点 E 元素
E:active 一个正处于某些用户操作状态的 E 元素
E:hover 一个鼠标滑过的 E 元素
E:focus 一个获得用户焦点的 E 元素
E:target 一个做为起 Refer 制定锚点的元素(url hash 相关)
E:lang(fr) 一个 language 是 fr 的 E 元素
E:enabled 一个UI 操作上 enabled 的 E 元素
E:disabled 一个 UI 操作上 disabled 的 E 元素
E:checked 一个 UI 操作上状态为 checked 的 E 元素
E::first-line E 元素中格式化后的第一行
E::first-letter E 元素的第一个字母
E::before 在 E 元素之前生成的内容
E::after 在 E 元素之后生成的内容
E.warning 一个class 属性包含 warning 的 E 元素
E#myid 一个 ID 为 myid 的 E 元素
E:not(s) 一个不匹配简单的选择器 s 的 E 元素
E F 一个作为 E 元素后代的 F 元素
E >F 一个作为 E 元素子元素的 F 元素
E + F 一个紧跟在 E 元素后面的 F 元素
E ~ F 一个出现在 E 元素前面(紧挨着)的 F 元素