css - 如何在 Safari 中使::选择正确？

Question

CSS ::selection 在 Safari 中不正确。

如果带有文本的 block 有一些子 block ，则父 block 中的选择不起作用。

例如:

::selection {
  background: #000;
  color: #fff;
}

<div class="parent">
  Text...
  <div class="child">Text...</div>
</div>

在此代码中，父 block 中的文本未选择我的样式(仅默认 OS X 选择)。 Result (screenshot) .

我该如何解决这个问题？ 将所有内容包装在 div 中并不是最好的解决方案... 我现在特别规则，但只适用于 FF ::-moz-selection。 在其他浏览器中，这样的代码效果最好。

Answer 1

这种变通方法是否适合您的情况？ http://codepen.io/panchroma/pen/GgdRvx

如您所见，我删除了子 div 并将其替换为试图模仿 div 的 span :)

HTML

<div class="parent">
   Parent text...
   <span class="child">Child text...</span>
</div>  

CSS

::selection {
  background: #000; 
  color: #fff;}

span.child{
  width:100%;
  display:inline-block;}

Safari 8.0.3 对我来说效果不错

祝你好运!