学习-WEB前端快速入门-20.22_CSS样式表_CSS样式表的引入方式

124 阅读1分钟
一、行内样式表

1.定义

 在标签内部通过style属性定义的css样式表
 <div style="background-color:red;"></div>

2.代码
<div style="background-color: skyblue";>这是一个div

这是另外一个div
3.效果

这是一个div
这是另外一个div
二、内部样式表

1.定义

在style标签内部定义的css样式表
<style>
div{
    background-color: red;
}
<style/>

2.代码

<head>
<meta charset="UTF-8">
<title>Title</title>

<style>
    div{
        background-color:pink;
       }
</style>
</head>

3.效果
备注:行内样式表内部样式表同在时,行内样式表优先加载

三、外部样式表

通过link标签,引入的外部,css文件中的样式表 rel="stylesheet"type="text/css" href:外部css文件路径 rel:引入文件类型 type:文本文件 通过在独立的html,css文件中书写css样式表

外部样式表和其它样式表同在时,总是最后一个加载。意味着,只要也看存在有行内、内部外部就不会生效。

▶️优先级,行内,内部,外部。