4

我正在尝试定位一个可能具有多个类之一的元素。难道没有更简单的方法来编写以下示例吗?我一直无法找到参考,但似乎应该有一个更有效的选择。

.myTable1 a, .myTable2 a, .myTable3 a, .myTable4 a
{
    text-decoration: underline;
}
4

4 回答 4

5

尝试 -

table[class^=myTable] a {
    text-decoration: underline;
}
于 2012-10-16T18:12:33.407 回答
4

如果您在谈论计算效率(即浏览器性能),那么我建议您坚持使用您已经拥有的东西。除此以外...

如果您知道class属性始终以 substring 开头,则myTable可以使用属性选择器:

[class^="myTable"] a
{
    text-decoration: underline;
}

如果你不能保证你需要一些更复杂的东西:

[class^="myTable"] a, [class*=" myTable"] a
{
    text-decoration: underline;
}

这里提供了一个解释。如果您发现这种语法晦涩难懂,那么我会再次建议您使用您已有的语法,因为它是最简单的。

或者,修改您的 HTML 以包含一个您可以选择的通用类。这将使您能够从已有的基础上进一步简化 CSS。

于 2012-10-16T18:14:45.133 回答
2

不,在纯 CSS 中没有更简单的方法。

但是,如果您的许多类都相似,则可以像这样进行模糊匹配*[class^="myTable"] { ... }

于 2012-10-16T18:12:41.937 回答
1

您可以在需要下划线链接的表中使用多个类。

HTML

<table class="myTable1 ul_table">...</table>
<table class="myTable2 ul_table">...</table>
<table class="myTable3 ul_table">...</table>
<table class="myTable4 ul_table">...</table>

CSS

.ul_table a {
    text-decoration: underline;
}
于 2012-10-16T18:20:54.707 回答