Question

当前在我的网页设计的UI中工作。我注意到div中的大纲没有显示在IEv11中吗？

在我的CSS中...

.samp-banner:focus, #samp-banner-id:focus,
#samp-close:focus, #samp-close-mobile:focus {
    outline: #c0dffb auto 1px;
}

.samp-banner {
    width: 100px;
    height: 100px;
    background-color: #d4edda;
    padding: 10px;
}

<div class="samp-banner" tabindex="0">sample</div>

更新：我尝试添加！important仍然无法正常工作。

Answer 1

您在CSS中使用outline-style: auto，这意味着浏览器将根据元素的上下文来决定要做什么。 Webkit与其他浏览器的呈现方式outline-style: auto不同。如果您想让浏览器之间的行为更为相似，建议您使用下面的代码或使用box-shadow。

.samp-banner {
  width: 100px;
  height: 100px;
  background-color: #d4edda;
  padding: 10px;
}

.samp-banner:focus {
  outline: 1px solid #c0dffb;
  outline-offset: 2px;
}

<div class="samp-banner">sample</dov>

Answer 2

替换

“概述：＃c0dffb自动1像素；”

使用

轮廓：＃c0dffb实心1像素；

CSS中的大纲在IE中不起作用（最新版）

2 个答案: