CSS基本知识2-CSS选择

选择就是CSS定义的第一部分,能够用面向对象的模式来理解,或者声明式的面向对象。css

标准选择:编程

#.Espa

进阶选择:“,”分隔多个相同项,至关于类的实例。 如:#btn1,#btn2,.btn {...}ssr

后代元素选择,至关于子类:对象

空格分隔: .nav p {...}    #header .nav span {...}get

子类在DOM中,是没有层级的。input

子元素选择,只选一级, >it

例如: nav > p {...}table

相邻选择使用+,如h1 + p {margin-top:50px;}class

属性选择器:按属性选择:[属性=值]

例如:input[type=text] 

以上选择器,能够作And运算,就是结合起来使用

 

可见,CSS选择器,和Sql语言也很类似了。是声明式的。属性选择器还有更多的条件,但不多被使用(固然若是用来作应用,或许能派上大用场)

CSS媒体查询,也是相似Sql的查询,原理是同样同样的。

 

伪类

W3C:"W3C" 列指示出该属性在哪一个 CSS 版本中定义(CSS1 仍是 CSS2)。

属性 描述 CSS
:active 向被激活的元素添加样式。 1
:focus 向拥有键盘输入焦点的元素添加样式。 2
:hover 当鼠标悬浮在元素上方时,向元素添加样式。 1
:link 向未被访问的连接添加样式。 1
:visited 向已被访问的连接添加样式。 1
:first-child 向元素的第一个子元素添加样式。 2
:lang 向带有指定 lang 属性的元素添加样式。

 

 更多的伪类,其实原理就是从Dom中查找某些特定的节点以代替编程,好比找第一个子,最后一个子,交替查找子,找为空的等等,总之,CSS选择器,就是类Sql的一个声明式编程。

相关文章
相关标签/搜索