更改选择的边框颜色

发布于 2024-11-16 02:26:45 字数 561 浏览 2 评论 0原文

我正在尝试使用 ::selection::-moz-selection 伪元素修改默认选择样式。我已经使用这两个规则成功更改了选择颜色和背景:

::-moz-selection{ background: #444; color:#fff; text-shadow: none; }
::selection { background:#444; color:#fff; text-shadow: none; } 

但是,我还需要将链接选择的 border-color 更改为白色。我正在尝试使用此 CSS 来实现此目的:

a::-moz-selection { border-color:#FFF;}
a::selection {border-color:#FFF; }

即使我添加 !important 覆盖,Safari 也不会设置边框颜色的样式。

我缺少什么?为什么我无法在选择时更改链接的border-color

I'm trying to modify the default selection styles by using the ::selection and ::-moz-selection pseudoelements. I've successfully changed the selection color and background with these two rules:

::-moz-selection{ background: #444; color:#fff; text-shadow: none; }
::selection { background:#444; color:#fff; text-shadow: none; } 

However, I also need to change the border-color to white on selection for links. I'm trying to accomplish this with this CSS:

a::-moz-selection { border-color:#FFF;}
a::selection {border-color:#FFF; }

Even when I add an !important override, Safari won't style the border color.

What am I missing? Why can't I change a link's border-color on selection?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

圈圈圆圆圈圈 2024-11-23 02:26:45

您无法为文本选择定义边框样式。

尝试定义一个 outline (它将成为 旧规范SitePoint Reference):

a::-moz-selection { outline: 1px solid #fff; }
a::selection { outline: 1px solid #fff; }

如果这不起作用,那么恐怕浏览器不支持 ::selection 上的轮廓。

请记住, ::selection 已移出选择器规范,CSS level 3 的其余部分仍然是草案,因此您还不能依赖浏览器正确/完全地实现它。

You can't define border styles for text selections.

Try defining an outline instead (it was going to be one of the allowed properties as stated in the old spec and the SitePoint Reference):

a::-moz-selection { outline: 1px solid #fff; }
a::selection { outline: 1px solid #fff; }

If that doesn't work, then I'm afraid the browser just doesn't support outlines on ::selection.

Remember that ::selection has been move out of the Selectors spec, with the rest of CSS level 3 still being a draft, so you can't rely on browsers implementing it correctly/completely just yet.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文