<style type =“text / css”>＆<link href =“style.css”rel =“stylesheet”type =“text / css”media =“screen”/> </style>之间的区别

Question

我对此非常陌生，所以它主要是（复制和粘贴），带有一点点YouTube和阅读材料。

为什么两者兼而有之？请简化您的回答，不要那么技术性。

Answer 1

<style type="text/css">是您希望在页面中嵌入样式规则的时间。

<link rel="stylesheet" href="path/to/style.css" />当你有一个单独的样式表文件要在当前页面中引用时 - 这意味着客户不必每次都下载CSS，这会使页面加载速度更快

CSS具有@import指令，如果您使用<style>@import style.css;</style>，那么它大致相当于<link rel="stylesheet" href="style.css" />（但有一些细微差别：请参阅Difference between @import and link in CSS）。

Answer 2

使用<style type="text/css">用于HTML文件中的CSS代码，<link...>用于包含外部CSS文件。

Answer 3

方法1 （使用<style type="text/css">）

是宣告CSS的简单方法。但它应该用于小代码。当您想要覆盖主样式表的属性时。

方法2 （使用<link rel="stylesheet" href="path/to/style.css" />）

这种方法的第一个优点是，我们在外部文件中有一个样式。这意味着我们可以反复使用它。但这并不是优势的终结。您可以告诉浏览器将文件保存在缓存中。这减少了页面加载时间。

---

什么更好？

在我看来方法2 。

Answer 4

第一种情况<style type="text/css">用于在html文件中包含css定义。第二种情况将css定义放在style.css（或任何文件是href）中。第二种情况使得在多个html文件中使用相同的css变得容易。

Answer 5

第一个用于直接在html文件中插入css代码，而第二个用于调用外部css文件。