伪类中的类

我有兴趣构建一个向后兼容的菜单栏。我只想使用HTML和CSS。所以我正在考虑一个表格，其中有许多单元格，每个单元格都根据其状态设置不同的背景颜色。沿着线的东西....伪类中的类

a:link { 
.cell01{background-color:#white}; 
.cell02{background-color:#white}; 
} 

a:hover { 
.cell01{background-color:#red}; 
.cell02{background-color:#blue}; 
}

（我想是这样的，我想整个细胞，而不仅仅是单元格中的文本来实现）。显然这个例子不起作用......但有没有办法？

在此先感谢

贾尔斯

来源

2010-10-14 giles

不知道你在这里后，你能更清楚吗？ – Ben 2010-10-14 07:12:12

-1

我假设你的HTML看起来像这样：

<table> 
    <td class="cell1"> 
     <a href="#">Link</a> 
    </td> 
    <td class="cell2"> 
     <a href="#">Link</a> 
    </td> 
</table>

如果是这样的情况下，仅使用HTML和CSS你问是不可能的。 CSS不允许你以任何方式定位选择器的父母。 JQuery可以做你正在问的使用.parent（）

来源

2010-10-14 07:14:59 jsnfwlr

-1问题仅针对HTML和CSS，而您建议使用JavaScript。 – Fenton 2010-10-14 10:26:29

@SteveFenton - 太棒了。这是不可能的使用CSS。正如我在答复中所述。我只是建议使用JavaScript，因为它是在不改变DOM的情况下完成它的唯一方法。 – jsnfwlr 2013-10-11 02:41:40

它可以很容易地用CSS完成 - 查看无数其他答案。 – Fenton 2013-10-11 07:19:56

如果你想影响整个单元格，你需要将CSS应用到父级。然后，孩子的标签可以单独行动。类似这样的：

parentCell { background:white; } 

parent1:hover { background:red } 
parent2:hover { background:blue } 

parent1:hover a { font-weight:bold } 
parent2:hover a { font-style:italic }

来源

2010-10-14 07:16:10 Ben

无论如何你可能不应该想到一个表。你可以很容易地设计一个UL，使其具有导航的外观，这在语义上更加正确。

无论如何 - 从上面的CSS我猜你有一个表内链接？如果是这样，那么正确的语法是：

a:link .cell01 { background-color: #fff; } 
a:hover .cell01 { background-color: #f00; }

等等等等

（如果你想用颜色名称，那么你不使用＃符号如果使用十六进制值然后使用＃。正如我上面所做的那样）。

或者你有链接内的链接？在这种情况下，您可以切换例如

.cell01 a:link {background-color: white; }

希望它有帮助！

更新：

啊 - 上面史蒂夫的回答给我的是什么，你正在尝试做的......你有表格单元格中的链接一个稍微好一点的想法，你想要的全细胞当它被盘旋时改变？然后简单地：

.cell01 { background-color: #fff; } 
.cell02:hover { background-color: #f00; }

请注意，这将无法在IE6上正常工作，因为在IE6中只有一个元素具有悬停状态。您可以通过在Javascript中添加额外的类来解决此问题（如有必要）...

来源

2010-10-14 07:16:42 vitch

爱情是怎样的？ :) – Ben 2010-10-14 07:25:10

史蒂夫和维奇是在正确的路线。您可以将您的锚设置为显示：block，以便填充整个列表项，这意味着点击目标和悬停目标是相同的。这也解决了IE6问题。 – Fenton 2013-10-11 07:22:26

第一：不要使用表格进行布局或导航。这是没有必要的。 UL通常是该任务的最佳选择。第二：让你的元素块级别和一些填充和风格，如你所愿：http://kod.as/lab/nav/

请参阅http://css.maxdesign.com.au/listamatic/了解更多。

来源

2010-10-14 07:59:51 Rimantas

+1块锚。 – Fenton 2013-10-11 07:23:06

回答

相关问题