基本CSS选择器

 1、标记选择器

       声明哪些标记采用哪种CSS样式。因此,每一种HTML标记的名称都可以作为相应的标记选择器的名称。例:

       

Code:
  1. <style>  
  2.     h1{  
  3.            color:red;  
  4.            font-size:25px;  
  5.     }  
  6. </style> 

2、类别选择器     class selector

      class selector的名称可以由用户自定义。例:

  

Code:
  1. <style type="text/css">  
  2. .red{  
  3.   color:red;  
  4.   font-size:18px;  
  5. }  
  6. </style>  
  7.   
  8. <body>  
  9. <p class="red">.......</p>  
  10. </body>  

在HTML的标记中,还可以同时给一个标记运用多个class选择器,从而将两个类别的样式风格同时运用在一个标记中。

Code:
  1. <h4 class="blue big">两种class,同时blue和big</h4>  

3、ID选择器

ID和CLASS的使用方法基本相同,不同的是ID选择器只能在HTML页面中使用一次,因此其针对性更强。

Code:
  1. <html>  
  2. <head>  
  3. <style type="text/css">  
  4. #bold{  
  5.   font-weight:bold;  
  6. }  
  7. </style>  
  8. </head>  
  9. <body>  
  10. <p id="blod">ID选择器</p>  
  11. </body>  
  12. </html>  

将ID选择器用于多个标记是错误的,因为每个标记定义的id不只是CSS可以调用,javascript等其他脚本语言同样可以调用。如函数getElementById()会出错。

id selector不支持像class selector那样的多风格同时使用,类似id="bold green"是完全错误的语法

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章