专注于IE 11中的块

Question

我有3个街区

.block1 {
  width: 600px;
  height: auto;
}

.block1 *:focus {
  box-shadow: 0 0 10px red;
}

.block2 {
  width: 500px;
  height: 400px;
}

<div class='block1'>
  <span>Block1</span>
  <div class="block2">
    <span>Block2</span>
  </div>
  <div class="block2">
    <span>Block2</span>
  </div>
</div>

在chrome中，我可以只关注交互式元素（按钮，输入和其他元素），但是在IE 11中，我可以通过鼠标关注该块，并且样式适用于此块

截屏：

如何避免将焦点样式应用于IE中的块？

Answer 1

将其更改为您的代码，然后检查一次。

.block1 *:focus:not(.block2) {
    box-shadow: 0 0 10px red;
    border:1px solid red;
}