开发者

Changing border-color on selection

I'm trying to modify the default selection styles by using the ::selection and ::-moz-selectio开发者_如何学JAVAn 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?


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.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜