html - css链接格式，样式

Question

为什么大多数开发人员使用

<link  href="/js/jquery-ui/css/flick/jquery-ui-1.8.23.custom.css" type="text/css" />
<link  href="/css/main.css" type="text/css" />
<link  href="/css/table.css" type="text/css" />

代替

<style type="text/css">
    @import "/js/jquery-ui/css/flick/jquery-ui-1.8.23.custom.css";
    @import "/css/main.css";
    @import "/css/tables.css";
</style>

即使在 html 标记中的自动生成代码中？最后一种方法的缺点是什么？

Answer 1

以下是我知道的几个缺点

• 旧浏览器不支持@import
• 我们不能利用 @import 来利用 rel 和 title 属性，而我们可以利用这些属性
• 链接方法以其简单而著称

为了了解@import 的更多缺点，请访问http://www.stevesouders.com/blog/2009/04/09/dont-use-import/

Answer 2

最大的缺点是 CSS @import 单独加载每个 CSS 文件，而不是一次加载文件。这意味着浏览器必须等待每个导入的 CSS 文件完成加载，直到它可以开始加载下一个。这会显着降低您的网站速度，尤其是在您有大量导入的 CSS 文件的情况下。