display: none 页面加载后应用缓慢答案

【问题标题】：display: none applies slow after page loaddisplay: none 页面加载后应用缓慢
【发布时间】：2013-03-28 13:37:51
【问题描述】：

我有一个使用 display: none; 隐藏错误消息的页面

页面加载时，错误消息会短暂显示，然后消失。似乎 ccs 对页面的应用速度很慢。

如何改善用户体验，并且在加载时不显示错误消息？

该页面还使用 Ajax 调用加载表。这会影响 css 应用于页面的方式吗？

谢谢。

【问题讨论】：

标签： css fouc

【解决方案1】：

只需将style="display:none;" 添加到您最初不想显示的页面上的实际html 元素或div 中。您不能立即依赖 CSS 文件。例如：

<div class="error" style="display:none;">
    <span class="myerror">Hello World!</span>
</div>

除了隐藏区域的例外情况，通常最好将所有 css 与页面和外部文件分离。

【讨论】：

【解决方案2】：

如果您使用<link> 调用您的CSS 文件，那么您应该尝试将您的CSS 放在<style> 中。应该更快。由于外部文件需要更长的时间才能加载，因此您在同一文件中拥有的 <style>。

【讨论】：