Question

<html>
<head>
<style>
#content input[type=text]
{
    color: green;
}
</style>
</head>
<body>
<div id="content">
<input type="text" value="Some Text" />
</div>
</body>
</html>

以下是它在FireFox中呈现的方式（字体为绿色）：

enter image description here

以下是它在Internet Explorer 7中呈现的方式（字体不是绿色）：

enter image description here

更新：添加DTD解决了这个问题，但是当输入设置为disabled="disabled"时，IE7仍然不会显示指定的颜色。

Answer 1

您需要为IE7添加严格的doctype以支持具有值的属性选择器。

http://msdn.microsoft.com/nl-nl/library/aa770069

使用像这样的文档类型，这可以在不破坏此功能的情况下尽可能宽松：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">

或者更确切地说，如果可以，请使用更新，更严格的。

Answer 2

您正在以Quirks模式运行您的网站。使用以下doctype或类似的

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Answer 3

为初学者<style type="text/css">

尝试此操作

Answer 4

尝试使用引号：

input[type="text"]

或者，使用一个类并将该类应用于所有文本输入。

Answer 5

也许不是你想要的，但至少它有效;）

<html>
<head>
<style type="text/css">
.green {
    color: green;
}
</style>
</head>
    <body>
        <div id="content">
            <input type="text" class="green" value="Some Text" />
        </div>
    </body>
</html>

CSS在IE7中不起作用，适用于其他浏览器

5 个答案: