[英]Can I apply a style to all pseudo selectors in CSS or Sass?
Is it possible apply style to all of an anchor tag's pseudo selectors with CSS or Sass?是否可以使用 CSS 或 Sass 将样式应用于所有锚标记的伪选择器?
Something like就像是
a:* {
color: #900;
}
instead of代替
a {
&:hover, &:link, &:active, &:visited {
color: #900;
}
}
I just want to reset standard styling.我只想重置标准样式。 In CSS, the wildcard can be used to apply styles to all elements... but how about to all pseudo-selectors?在 CSS 中,通配符可用于将样式应用于所有元素……但是如何应用于所有伪选择器呢?
Short Answer : No, not directly简短回答:不,不直接
However, a mixin could be used to have a similar effect.然而,mixin 可以用来产生类似的效果。
// Sets the style only for pseudo selectors
@mixin setLinkSelectorStyle {
&:hover, &:link, &:active, &:visited {
@content;
}
}
// Sets the style to pseudo selectors AND base default anchor
@mixin setLinkStyleAll {
&, &:hover, &:link, &:active, &:visited {
@content;
}
}
a {
color:red;
@include setLinkSelectorStyle {
color:gold;
}
}
a.specialLink {
@include setLinkStyleAll {
color:purple;
}
}
[Example using http://sassmeister.com/ compiled SASS] [使用http://sassmeister.com/编译SASS的例子]
a { color: red; } a:hover, a:link, a:active, a:visited { color: gold; } a.specialLink, a.specialLink:hover, a.specialLink:link, a.specialLink:active, a.specialLink:visited { color: purple; }
<a>Normal anchor, No href (:link won't work, but other selectors will)</a> <hr /> <a href="#">Normal anchor</a> <hr /> <a class="specialLink">Specific class (no href)</a> <hr /> <a class="specialLink" href="#">Specific class</a>
The mixins will create a rule for all the pseudo selectors when the mixin is included on the anchor / class.当 mixin 包含在锚点/类中时,mixin 将为所有伪选择器创建规则。
Removed old answer, look at history to see it.删除旧答案,查看历史记录即可。
U can do it like that:你可以这样做:
&:before, &:after {
content: 'a';
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.