I have a spanned class called "tomato".
我有一门叫做“西红柿”的课。
My css is:
我的css是:
.tomato a:link {color:#FF0000;} /* unvisited link */
.tomato a:visited {color:#FF0000;} /* visited link */
.tomato a:hover {color:#FF0000;} /* mouse over link */
.tomato a:active {color:#FF0000;} /* selected link */
Is there a way I can combine all these into a smaller piece of code? (I want the link to be red in all states)
有没有一种方法可以把所有这些合并成一个更小的代码?(我希望所有州的链接都是红色的)
3 个解决方案
#1
20
This is the shortest
, I don't think you can do it any shorter than:
这是最短的,我不认为你能做得比:
.tomato a:link, .tomato a:visited, .tomato a:hover, .tomato a:active { color:#FF0000; }
OR
或
.tomato { a:link, a:visited, a:hover, a:active { color:#FF00000; } }
Hope this helps.
希望这个有帮助。
#2
11
.tomato a:link,
.tomato a:visited,
.tomato a:hover,
.tomato a:active {
color:#F00;
}
Note, the color HEX could be abbreviated, too. :)
注意,颜色十六进制也可以缩写。:)
If you choose to use a CSS framework to organize your CSS such as LESS, it could be much simpler than the above:
如果您选择使用CSS框架来组织您的CSS,那么它可能比上面的要简单得多:
.tomato {
a:link,
a:visited,
a:hover,
a:active {
color:#F00;
}
}
#3
4
It is actually best to use the attribute selector. In this case it would be:
实际上最好使用属性选择器。在这种情况下,它将是:
.tomato a[href]{color:#F00;}
or if you must:
或者如果你必须:
.tomato [href]{color:#F00;}
#1
20
This is the shortest
, I don't think you can do it any shorter than:
这是最短的,我不认为你能做得比:
.tomato a:link, .tomato a:visited, .tomato a:hover, .tomato a:active { color:#FF0000; }
OR
或
.tomato { a:link, a:visited, a:hover, a:active { color:#FF00000; } }
Hope this helps.
希望这个有帮助。
#2
11
.tomato a:link,
.tomato a:visited,
.tomato a:hover,
.tomato a:active {
color:#F00;
}
Note, the color HEX could be abbreviated, too. :)
注意,颜色十六进制也可以缩写。:)
If you choose to use a CSS framework to organize your CSS such as LESS, it could be much simpler than the above:
如果您选择使用CSS框架来组织您的CSS,那么它可能比上面的要简单得多:
.tomato {
a:link,
a:visited,
a:hover,
a:active {
color:#F00;
}
}
#3
4
It is actually best to use the attribute selector. In this case it would be:
实际上最好使用属性选择器。在这种情况下,它将是:
.tomato a[href]{color:#F00;}
or if you must:
或者如果你必须:
.tomato [href]{color:#F00;}