[2016-01-16][CSS][定义样式表(样式选择器)]

[2016-01-16][CSS][定义样式表(样式选择器)]
 
  • Class
            定义:.classname{ 属性:属性值;}
            使用:<p class = "classname"></p>
  • ID
    • 定义: #IDNUM{ 属性:属性值; }
    • 使用:<p id = "IDNUM"></p>
  • 组合选择器
    • 定义:标记1,标记2...标记n{属性:属性值;}
    • 使用:直接正常使用上面存在标记即可
  • 伪选择器
 

calss的使用
ID的使用

组合选择器h1

h2

h3

 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<html>
    <head>
        <title>[2016-01-16][CSS][定义样式表(样式选择器)]</title>
        <meta charset="utf-8">
 
        <style type="text/css">
        .class1{
            color:red;
        }
        /*<!--优先级:ID>Class>HTML-->
         
        <!--定义class-->
        <!--定义以.开始-->
        <!--花括号内,属性:属性值;(必须以分尾)-->号结
        <!--ID定义-->
        <!--ID定义以#开头-->*/
         
        #ID1{
            color:blue;
        }
         
       /* <!--组合选择器-->*/
         
        h1,h2,h3{
            color:green;
        }
         
        /*<!--伪元素选择器-->*/
       a:visited { color:red; }
         </style>
    </head>
    <body>
     
        <div class = "class1">
            calss的使用
        </div>
        <div id="ID1">
            ID的使用
        </div>
        <div>
             
            <h1>组合选择器h1</h1>
            <h2>h2</h2>
            <h3>h3</h3>
        </div>
        <div>
        <a href="http://www.baidu.com/">伪选择器 </a>
        </div>
    </body>
</html>



来自为知笔记(Wiz)



posted on 2016-01-16 21:46  红洋  阅读(195)  评论(0)    收藏  举报

导航