CSS选择器介绍

由于这次项目突破性的选择了做前台，所以开始学习CSS

选择器的几种格式：

 

1 派生选择器  

              (1)body p{background-color:red}body中所有的p标签都会满足这一属性，即使嵌套多层依旧满足这个条件

              (2)body > p {background-color:red}这样只有body中第一层p标签会被赋予这个属性 可以和第一种方法结合起来用

 

2 id选择器  

              (1) #tag{background-color:red;}将id位tag的属性设置为CSS样式

              (2)与派生选择器结合 #tag p{background-color:red}

 

3类选择器

              (1)格式：.center{text-align:center;}

              (2)也可以与派生选择器结合，.center p {...}

              (3)*.someClass和.class是效果一样的  所以可以指定class类中某个特定元素的属性 比如 p.class{....}

              (4)可以进行多类选择，比如<p class ="class1 class2">    .class1.class2{}//这是声明两个类共同属性的方法

 

4属性选择器   

              (1)基本格式 [title]{background-color:red}包含title属性的会应用样式

              (2)扩展属性 [title = uni]{.....}  指定特定的属性

                          [title ~= uni]{...}   属性中用空格隔开包含uni属性的会应用该样式

                          [title = uni]        指定用-连接

              (3)标签[指定某种属性]  input[type = text]{}  //指定文本框的属性 

                                     *[title]等价于[title]