CSS3.0_选择器_学习笔记

元素选择器：每个元素名

通用选择器：*（一般结合其他选择器出现）

类选择器：.类名

id选择器：#id

 1 <!DOCTYPE>
 2 <html>
 3 <head>
 4 
 5 <title>Css3.0_selector</title>
 6 <style type="text/css">
 7 p{
 8 color:#006600;
 9 }
10 .classselector{
11 color:#00CCFF;
12 }
13 #idselector{
14 color:#FFFF00;
15 }
16 h1,h2,h3,h4,h5{
17 color:#FF0000;
18 }
19 span>i{
20 color:#0000FF;
21 }
22 span p{
23 color:#FF00FF
24 }
25 </style>
26 </head>
27 
28 <body>
29 <p>元素选择器</p>
30 <span class="classselector">类选择器</span>
31 <div id="idselector">id选择器</div>
32 <h1>..........1</h1>
33 <h2>..........2</h2>
34 <h3>..........3</h3>
35 <h4>..........4</h4>
36 <h5>..........5</h5>
37 <span><i>子选择器</i><i>子选择器</i><p>lazygun</p></span>
38 </body>
39 </html>

选择器的优先级

1、!improtant(覆盖任何元素样式)

2、<span style=""></span>

3、id选择器

4、类选择器，属性选择器，伪类选择器

5、元素选择器

6、通配选择器

相同级别的选择器将由定义他的位置决定

1、<head>

     <style>

     </sytle>

     </head>

2、<style/>标签中的 @import 引入样式表

3、<link/>标签所引入的样式表定义
4、<link/>标签所引入的样式表内的 @import 导入样式表定义
5、样式有用户设定
6、由浏览器默认

 

 

posted on 2012-01-09 14:24  lazygun  阅读(172)  评论(0)    收藏  举报

导航