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.
精彩评论