Question

所以，我有一个HTML页面的2个CSS文件。页面加载时，它会显示第一个CSS页面的样式，然后加载第二个CSS文件。所以，对于那一秒钟，我的页面看起来与它应该是的有点不同。我们怎能避免它？

例如，我有bootstrap.css和我的自定义css。在加载custom.css之前，它总是会显示bootstrap.css样式。

Answer 1

很难看到您的代码，但如果您的自定义文件中没有多少CSS，我建议您将其添加到第一个CSS文件的底部

Answer 2

FOUC没有发生，因为您按特定顺序加载了样式表。

这是因为你已经（部分）构建DOM后加载CSS。要防止它，请不要在<body>中加载CSS，而是在<head>中加载。按您想要的任何顺序。

如果您确实在<body>中放置了样式规则或引用，请确保它们位于受影响的元素之上。

Answer 3

你可以使用JQuery来做到这一点。

$(function () {
setTimeout(function(){
	$('<link rel="stylesheet" type="text/css" href="style/style_2.css">').appendTo("body");
}, 3000);
});

更改附加第二个CSS样式的时间。希望能帮到你。