html - IE8 没有概述文本框

Question

在 IE8 中，当我像这样设置输入字段的边框时：

input {
  border: 0;
}

输入字段周围没有所需的边框，但是只要焦点位于输入上，我就想要像 Chrome 或 Safari 中的标准轮廓。现在，我可以通过伪类添加边框:focus，但我不希望伪类应用于已经有标准轮廓的浏览器。

我怎样才能做到这一点？

编辑：我刚刚发现:focus在 IE8 中不起作用。我必须添加一个 DOCTYPE 才能让它工作。

score 4 · Accepted Answer

要专门针对 ie8，您可以使用此方法

将 ie8 类添加到您的 html 标记并从中继承。

在你的 html 标签上

<!--[if IE 8]>     <html class="ie ie8 lte9 lte8"> <![endif]-->

你的 CSS

.ie8 input:focus {
  //your styles
}

score 1 · Accepted Answer

您可以在条件 CSS 样式表中包含该样式：

<!--[if IE]>
<link rel="stylesheet" type="text/css" href="all-ie-only.css" />
<![endif]-->

然后在该外部样式表中，包含您的 CSS，例如：

input:focus { border: 1px solid golden; }

focus应该在IE8中工作。添加doctype并查看。

2 回答 2