Question

我有一个非常简单的页面，有一个dijit按钮。我试图用蓝色，时间，粗体覆盖按钮上的字体。它在FF中运行良好，但在IE中，我只是看到黑色，arial，普通文本。如果我查看IE开发工具栏，它会将规则显示为应用，但不会显示在显示中。难道我做错了什么？这是代码：

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Theme Test</title>
        <link href="js/dojo/resources/dojo.css" rel="stylesheet" type="text/css">
        <link href="js/dijit/themes/tundra/tundra.css" rel="stylesheet" type="text/css">
        <style type="text/css">
            .tundra .dijitButton {
                font-family:'Times New Roman',Times,serif;
                color:#3a7bb8;
                font-weight:bold;
            }
        </style>
        <script type="text/javascript" src="js/dojo/dojo.js" djConfig="parseOnLoad:true, isDebug:false"></script>
        <script type="text/javascript">
            dojo.require("dijit.form.Button");
            dojo.require("dojo.parser");
        </script>
    </head>
    <body class="tundra">
        <button dojoType="dijit.form.Button">This should be Times, Bold, Blue</button>
    </body>
</html>

Answer 1

尝试使选择器更具体，因此您可以确保它优先，例如：

body .tundra .dijitButton {}

或者，如果IE有一个关于没有正确级联样式的奇怪错误，请选择要在您要修改的精确区域上应用的类，例如：

body .tundra .dijitButtonText {}

Answer 2

使用<button>作为选择器似乎有效：

<style>
button {
    font-family:'Times New Roman',Times,serif;
    color:#3a7bb8;
    font-weight:bold;
}
</style>

您还可以使用更具体的选择器.tundra button，.tundra #myDiv button等

Answer 3

我还不能投票，但我遇到了同样的问题。使用按钮选择器不是为我切割它。相反，jrburke发布的解决方案是正确的。 “IE有一个奇怪的错误，关于没有正确地级联样式，选择应用于你想要修改的精确区域的类”

.dijitButtonText {}就是我们所需要的。

我用过

.dijitButton .dijitButtonNode {}用于背景颜色等。

.dijitButton .dijitButtonNode .dijitButtonText {}用于字体主题。

我也用过

.dijitButton.dijitButtonHover .dijitButtonNode .dijitButtonText {}

.dijitButton.dijitButtonActive .dijitButtonNode .dijitButtonText {}

Answer 4

这可能不太理想，但我可以使用ID而不是类来使用它。也许IE在渲染dijit后不适用这种风格？我不知道......这是我使用的代码：

<style type="text/css">
    #btn {
        font-family:'Times New Roman',Times,serif;
        color:#3a7bb8;
        font-weight:bold;
    }
</style>

<button dojoType="dijit.form.Button" id="btn">This should be Times, Bold, Blue</button>

dijit按钮主题不明显适用于IE6

4 个答案: