css中的选择器

1.在html中引入css的方法:四种方式:

  a.行内式(也称内联式) 如:

           <h1 style="color:red;test</h1>

  b.内嵌式

           <style type="text/css">

               h1{

                         color:red;

                          font-size: 10.5pt; font-family: Calibri, sans-serif; line-height: normal; widows: auto;">                 }

           </style>

  c.导入式

            <style type="text/css"> @import"mystyle.css";</style>

  d.链接式

         <link href="mystyle.css" rel="stylesheet" type="text/css"/>

2.css选择器:包括基本选择器和复合选择器

 

   基本的CSS选择器: 如 h1{color:red;font-size:25px;}这里h1为选择器名称,color和font-size为属性而red和25px为值。

   基本的CSS选择器包括标记选择器,类选择器和ID选择器。

 

      标记选择器:由html的标记构成css的选择器名称,如上例子说描述。

      类选择器:可以应用于不同的元素。 例如<p>元素和<h>元素可以共用类选择器。

      ID选择器:和类选择器一样,由开发者命名。id选择器只能赋给一个元素。

 

      类别选择器定义的时候以 .开始  在元素中通过class属性来应用.

      ID选择器定义的时候以 # 开始 在元素中通过id来应用。

 

    注意:类选择器和ID选择器的优先级大于标记选择器。

 

    复合选择器:

    "交集"选择器:

          div.special{...}

          div#special{...}

          "交集"选择器是指:以一个标记选择器开始 后面跟着一个类选择器或ID选择器, 它表示必须满足标记选择器的标记,同时必须声明了后面的类别或ID。

 

     "并集"选择器:

              div,h1.first,p.specia{...} 

         多个选择器通过逗号相连,只要满足其中任一个选择器的元素都会被选中。

 

     "后代选择器":

              div h1.first span.firstLetter{......}

          多个选择器通过空格相连,表示同时满足所有的选择器的元素会被选中。

 

     css的继承特性:当使用CSS对某一个元素设置以后,这样的一个设置会对该元素产生作用,以及对该元素所有的子元素产生作用.(文档结构对象模型DOM)

     css的层叠特性:解决样式的重叠现象。

                    规则:  行内样式>ID样式>类别样式>标记样式

 

 

 

        

posted @ 2016-04-09 07:16  技无止境  阅读(267)  评论(0编辑  收藏  举报