Question

我遇到了我的页面加载的问题，然后在几分之一秒后发生CSS效果或样式。

我看到的主要问题是我正在使用的JQuery选项卡 http://docs.jquery.com/UI/Tabs#source

当页面呈现时，标签会在另一个下方显示一个，如下所示：

One 
Two
Three

然后以标签正确呈现

有没有一种快速简便的方法来解决这个问题。感谢

Answer 1

这不是造型;它是jQuery UI javascript库，它将必要的html附加到您的页面，以便标签看起来非常像。

您有几个选择。首先，您可以隐藏选项卡并在jQuery UI完成其魔术后显示它们。其次，您可以设置选项卡的样式，使它们看起来足够接近完成的输出，以便更改不那么明显。第三，您可以删除jQuery UI并仅使用CSS设置选项卡样式。我会说所有有效的方法。

希望这有帮助！

编辑：

对于第一个选项，我们假设这是包含标签的div：

<div id="tabs">
  ...stuff...
</div>

在样式表中，隐藏#tabs：

#tabs {
    display:none;
}

然后，像这样修改你的jQuery UI调用：

var t = $("#tabs");

t.tabs({
    create:function(){
        t.show();
    }
});

Answer 2

weirdlover的响应几乎对我有用（使用jQuery 1.5.2），但我不得不挂钩create事件：

var t = $("#tabs");

t.tabs({
    create:function(){
        t.show();
    }
});

谢谢！

Answer 3

CSS是否通过Javascript应用？在这种情况下，您可以添加一些静态CSS，通过添加一些静态CSS，确保元素在执行javascript之前至少显示为水平排列。

如果是浏览器在没有它的情况下决定在渲染后应用CSS的情况，那么你无能为力。然而，可能是CSS加载缓慢（如果是外部文件），在这种情况下，您可以直接在HTML中将最重要的样式添加到CSS部分。

Answer 4

浏览器通常会加载HTML代码中显示的文件。请务必先将引用放在CSS文件中，以便尽快加载。

如果使用Javascript应用CSS，则无法加快加载速度。需要先加载Javascript文件才能使用它。

除此之外，我认为没有办法控制浏览器渲染的工作方式。