CSS三种样式表 内部样式表、行内部样式表、外部引用

目录

CSS三种样式表

1、内部样式表

2、行内部样式表 

3、外部引用： 

---

CSS三种样式表

1、内部样式表
2、行内样式表（内联式）
3、外部样式表（外链式）

1、内部样式表

内嵌式：将CSS代码集中写在HTML文档的head头部标签中，并且用style标签定义。

直接在hello world.html 文件区域使用style元素来包含CSS。

hello world.html文件代码： 

    
    
    
   


    

        
LY python 练习
        
hahahaahhahhahahaha
        
hello world ,练习web加油加油,LY
        小渣渣主页面
        

        
    
    

    

        

            
data1
            
data2
            
data3
        
        

            
11
            
22
            
33
        
        

            
111
            
222
            
333
        
    
    

        
情深缘浅
        
情非得以
        
纸短情长
    
    

        
说散就散
        
绿色
        
三生三世
    
    

        
我曾
        
鼓楼先生
            

                
汉斯
                
男
                
32
            
        
        
寒鸦少年
    

---

2、行内部样式表 

内联样式：又有人称行内样式、行间样式、内嵌样式。是通过标签的style属性来设置元素的样式。这个我们在上一篇文章中就有用上，可看上一章回顾一下。

---

3、外部引用： 

使用外部CSS文件，所以在这边我们要新建一个.css文件，我这边给它重命名为text.css。 

hello world.html文件代码：

    
    
    
      


    

        
LY python 练习
        
hahahaahhahhahahaha
        
hello world ,练习web加油加油,LY
        小渣渣主页面
        

        
    
    

    

        

            
data1
            
data2
            
data3
        
        

            
11
            
22
            
33
        
        

            
111
            
222
            
333
        
    
    

        
情深缘浅
        
情非得以
        
纸短情长
    
    

        
说散就散
        
绿色
        
三生三世
    
    

        
我曾
        
鼓楼先生
            

                
汉斯
                
男
                
32
            
        
        
寒鸦少年
    

text.css文件代码：

div{
    border:1px dashed red;
    width:500px;
    margin-bottom:50px;
    position: relative;
    left: 400px;
}
p{
    color: aqua;
}
ol{
    background-color: blueviolet;
}

 无论是用内部还是外部都是一样的结果。我们通常都使用外部引用，因为随着代码的不断增加，内部样式表会让我们后期修改变得更加不便。

运行结果展示图：

总结：

 整体内容简单，掌握好即可。