Question

我认为我们大多数人都知道IE7中这个令人讨厌的错误，如果输入的文本长于文本输入的宽度，文本输入的背景图像将会滚动。

这些问题和帖子都需要在文本输入周围包裹div。当我使用CMS生成的标记时，这是我无法做到的。

但是，我想优雅地降低体验。对于IE7及以下版本，我很高兴不显示背景图像，只显示颜色。

这是使用的css：

form input[type="text"], form input[type="password"]{
    background-image: url('bg.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;

    padding-left: 4px;
    padding-right: 4px;

    width: 100%;
    height: 30px;
        border: #008296 1px solid;
}

我尝试添加background-attachment: fixed，但背景图片不再显示在所有版本的IE，Firefox和Chrome中！由于我只想在IE7及以下版本中使用此行为，除了创建仅限IE7的样式表之外，我该怎么做呢？

Answer 1

您总是可以使用IE7特定的CSS选择器过滤器来覆盖IE7所需的样式。

要创建仅适用于IE7的类，只需将*:first-child+html放在您的类名前面。

另一个选择是声明特定于IE的CSS规则（又名IE CSS hacks）。这将涉及在仅适用于IE7及以下的属性之前放置一个星号（*）。虽然它不是有效的CSS语法，但这并不是很受重视。

您可能会发现此网站对于处理IE和CSS黑客感兴趣：http://www.javascriptkit.com/dhtmltutors/csshacks2.shtml

在IE7中滚动文本输入背景

1 个答案: