css - 是否内联 CSS？ (我可以根据 CSS 大小做出决定吗)

Question

我有一个这样的CSS。

body{background-color:#eee;margin:0,padding:0,...}div{...}a{...}a:hover{...}

它很好，包装也很好。 它位于 HTML 页面内，如下所示:

<style>body{backgr...</style>

现在，我们还假设不需要将样式表应用到其他页面(如果我正在编写单页应用程序可能就是这种情况)

我应该把它放在外部文件中(以便它可以被缓存)还是直接在我的网页中内联它？

我可以根据 CSS 的大小做出决定吗？ (例如，如果 200 个字符或更少则内联；否则在 css 文件中)

Answer 1

不，不要使用 inline-css，原因如下:

1. 可以缓存 CSS，从而提高性能。
2. 以后，当您拥有包含大量 HTML 标记的巨大页面时，要找到每个内联 CSS 规则并修复它，这将是一件令人头疼的事情。如果您有内联样式，则修改网站的外观会变得更加困难。
3. HTML 标记定义网页的语义结构，其视觉方面必须单独处理。

在以下情况下使用 inline-css:

1. 您必须针对单个元素的行为。
2. 你要处理优先级(inline-css的优先级最高)

如果你有大约 200 个字符的 CSS，应用在一个页面上，为什么不把它放在文档中，即在样式标签中:

<style>
    /*200 char CSS here*/
</style>