Question

I've changed the color of my text when it's highlighted/selected, but I've just noticed that text-decorations are still black.

I added text-decoration-color: #fff to my ::selection css but it didn't take effect, does it need to be done another way?

My CSS is:

::-moz-selection {
  background: rgba($colorRed, .85);
  color: #fff;
  text-decoration-color: #fff;
}

::selection {
  background: rgba($colorRed, .85);
  color: #fff;
  text-decoration-color: #fff;
}

Answer 1

很抱歉，无法在text-decoration-color选择器中更改::selection。只能设置颜色，背景，光标和轮廓。

在我的研究过程中，我无法弄清楚如何在选择时应用大纲样式，但这不是你的问题W3C Schools

Answer 2

文本装饰只有在已经为元素设置样式时才有效。

text-decoration, on ::selection 仅适用于已设置相同装饰属性的元素。

p{
text-decoration:underline overline transparent;
}

::selection{
text-decoration: underline overline red;
background:green;
}

<p> SELECTED TEXT WILL DIFFER THAN UNSELECTED BE UNDERLINED</p>

text-decoration 上的选择是 possible

How to change the color of a text-decoration on highlight/selected text

2 个答案: