css的层叠样式

1 css的层叠样式有四种：

行内样式

内嵌样式

外链样式

导入样式

1.1行内样式

 行内样式又叫做标签样式，它是在标签里面加上style属性。

    
    

     

这是行内标签

1.2内嵌样式

 它的样式写在style标签里面（style标签是要写在head标签里面的喔）

    
    
 

     

这是内嵌标签

1.3外链样式

用外链样式需要以下三个步骤：

  第一步：新建一个css的文件，专门用来写css样式

 第二步：head标签内写入link标签（link标签可以存在body标签里面，一般不推荐使用）

 第三步：link里herf属性将css文件引入（路径：用绝对路径和相对路径都可以的） 

    
    
   

     

这是外链标签

1.4导入样式

也是写在style当中：

    
    
   

     

这是导入标签

 

 2.选择器

 2.1基本选择器

有四种：

标签选择器

ID选择器

类选择器

通用选择器（通配符选择器）

 


    
    
   

     

这是游戏

     

这是电视

     

这是一个div

     

这是第二个div

     

这是第二个游戏

2.2包含选择器

包含选择器这里介绍三个：

名称	释义
子代选择器	获取某个标签的第一级子标签
后代选择器	获取某个标签内的所有子标签
分组选择器	也叫作逗号选择器，可以给多个标签加上样式，通过逗号隔开

 /*这是注释*/

    
    
   

     

这是标签

     

这是电视

     

       

         
• 飙速宅男1

         
• 飙速宅男2

         
• 飙速宅男3

         
• 飙速宅男4

         
• 飙速宅男5

       

       

飙速宅男6

       

飙速宅男7

       

飙速宅男8

       

飙速宅男9

     

2.3属性选择器

 


    
    
   

     

这是个div

     

这是段落

     
     
       
   

这是二个div

   

这是三个div

   

这是另一个段落

   

 2.4伪类选择器

在同一个标签内，根据不同的状态，有不同的样式，这就叫做伪类，使用的是冒号：表示

属性	释义
link	超链接点击之前的样式
visited	链接被访问后
hover	悬停，鼠标放到标签上的样式
active	被激活的时候，鼠标点击的时候，但是是在不松手的情况下
focus	某个标签获得焦点的时候

    
    
   

     点击我  

他们的顺序是一定的，不可以改变，但他们的顺序是：link   ：visited   ：hover    ：active 

2.5 伪元素选择器

：after           ：before         ：：after        ：：before

注: 如果要是使用before和after，一定要加上content（内容）属性