|
办法
css的样式引用由3种方式。分别为内联定义、链入内部CSS和链入外边CSS。有一点重视，样式表放在区别的地区，产生功效的范围区别（以下会说明）。
内联定义
内联定义，即在对象的标记内运用对象的style属性定义适用的样式表属性，格式定义为 :<div style="内容"><div>，如下示例
浏览器此时表示内容
链入内部CSS
CSS内链接是由于<style></style>标记对放在<head></head>中，在<style>中有一个类型属性type，后面接test/css，暗示CSS文本，语法格式如下：
<style type="text/css">
/*这儿写CSS内容*/
</style>
示例如下：
效果图如下：
链接外边CSS
css外链接是把CSS文件放在网页外面，经过链接<link>使CSS文件对本网页的样式有效，就相当于C语言的.h文件喽。
<link>里面的属性有type、rel、href，其中type固定为text/css，rel（即样式表）固定为stylesheet，href自然指的便是css文件的位置了，语法格式为：
<link type="text/css" rel="stylesheet" href="css文件的存放位置">
示例代码如下：
web.css内容为
效果如下
三种样式范围及优先级
简而言之吧，
链接外边CSS：功效在引用该CSS文件的网页中。
链接内部CSS：只功效在该CSS文件的网页中。
内联定义：只功效在定义该样式的div层中，对其它层没效。
三种样式优先级
不晓得以“优先级”这个词来形容是不是合适，专业的倘若看到莫怪。下面以代码效果说明：
我在外边CSS文件内定义class的div1背景颜色为红色，内部CSS定义为黑色，内联定义为绿色，效果图如下：
表示为绿色，好吧，内联定义优先级最高。
而后我再把内联定义去掉，比较一下内部CSS和外边CSS的优先级，如下
此时效果图如下：
恩，就这般了，内部CSS次之，外边CSS优先级最低。要紧的话说三遍，优先级：内联定义最高、内部CSS次之、外边CSS优先级最低。或许我提优先级的时候，非常多人感觉想想亦应该是这般。恩，我亦这般想的，不外还是验证一下呗，大周末的亦没事儿，斗地主亦没豆子了。
我是胖虎，一个正在创业的前端工程师，倘若你一样迷茫不晓得前端该怎样学习，能够加入我的自学团，会有知识分享，匹配学习伙伴，还能够参加我组织的上线项目及活动。
想加入的伙伴给我留言或直接私信
原文链接：HTML引入CSS样式三种办法及优先级_王文松的博客-CSDN博客_css优先级
| 
发表于 2024-6-30 08:27:22
