外部样式表用标签<link/>导入放在头部，为啥不需要<style></style>,而@import要放在 <style>里面？

Posted 2023-05-08

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了外部样式表用标签<link/>导入放在头部，为啥不需要<style></style>,而@import要放在 <style>里面？相关的知识，希望对你有一定的参考价值。

不知道楼上的试过没有，我编的时候没有都可以的情况

追答

link引入的是文件，style是在html中引入css代码，import是在css文件中引用其他css文件。

1、使用外部样式表，每个页面使用 <link> 标签链接到样式表，<link> 标签在（文档的）头部

<head>
<link rel="stylesheet" type="text/css" href="mystyle.css" />
</head>

2、使用内部样式表，也就是自己在 HTML 文档中创建样式表，可以使用 <style> 标签在文档头部定义内部样式表

<head>
<style type="text/css">
  hr {color: sienna;}
  p {margin-left: 20px;}
  body {background-image: url("images/back40.gif");}
</style>
</head>

3、使用内联样式表，也就是在标签中直接定义样式表，可以在标签中使用 style 属性来定义

<p style="color: sienna; margin-left: 20px">
This is a paragraph
</p>

当一个文档应用了多个样式表时，优先级分别为：优先应用内联样式表，再应用内部样式表，最后才应用外部样式表

例如，外部样式表拥有针对 h3 选择器的三个属性：

h3 {
  color: red;
  text-align: left;
  font-size: 8pt;
  }

而内部样式表拥有针对 h3 选择器的两个属性：

h3 {
  text-align: right; 
  font-size: 20pt;
  }

那么 h3 得到的样式是：

color: red; 
text-align: right; 
font-size: 20pt;

以上是关于外部样式表用标签<link/>导入放在头部，为啥不需要<style></style>,而@import要放在 <style>里面？的主要内容，如果未能解决你的问题，请参考以下文章