第十三节 CSS选择器 

 1 <!-- 1、标签选择器：影响范围较大，尽量使用在层级选择器中
 2         *{}：作用于所有标签
 3         div{}:所有div标签
 4      2、ID选择器：精确到单个标签，实际开发中不怎么用，优先级高于类选择器
 5      3、类选择器：一个类可以应用于多个元素，一个元素也可以使用多个类，应用灵活，可复用，是CSS用应用最多的一种选择器
 6      4、层级选择器：主要应用在选择父元素下的子元素，或者子元素下面的子元素，可以和标签元素结合使用，减少命名
 7      同时也可以通过层级，防止命名冲突,和类选择器一起配合使用
 8      5、组选择器：将同样的样式抽取出来，写在一起 
 9      6、伪类及伪元素选择器：常用的伪类选择器有hover一般用在链接响应的时候，表示鼠标悬浮在元素上时的状态，伪元素选择器有before和after，他们可以通过样式在元素中插入内容。
10 
11           -->
12 <!DOCTYPE html>
13 <html lang="en">
14 <head>
15     <meta charset="UTF-8">
16     <title>Document</title>
17     <style type="text/css">
18         *{
19             font-size:30px;
20             color: red;
21         }
22 
23         div{
24             font-size: 40px;
25             color: blue;
26         }
27         
28         #div2{
29             font-size: 50px;
30             color: pink;
31         }
32 
33         .green{
34             font-size: 10px;
35         }
36         .big{
37             color: black;
38         }
39     </style>
40 </head>
41 <body>
42     <div>这是第一个div</div>
43     <p>这是第一个P标签</p>
44     <div id="div2">这是第二个div</div>
45     <!-- 不允许ID重复，类似数据库中的主键 -->
46     
47     <div class="big green">这是第三个div</div>
48 </body>
49 </html>

 

posted @ 2020-03-05 14:57  kog_maw  阅读(127)  评论(0)    收藏  举报