过渡表使用CSS显示隐藏的span类文本

史蒂芬·艾伦·斯塔纳(Steven Ellen Starar)

我有一个<tr>类,当用鼠标将整个行滚动到该行上时,我希望其中一个单元格中包含一些文本。如果可能,可以使用CSS做到这一点,如何对整个表行进行翻转显示以前隐藏在一个单元格中的文本,同样适用于其中具有单元格的任何其他行在单元格中带有自己的隐藏文本。我知道它可能需要jQuery才能完成,但是如果可能的话,在纯CSS中,这将是首选。

这是一个示例,在论坛名称上的翻转显示了子论坛:http : //www.kanyetothe.com/forum/

乔纳斯·格鲁曼(Jonas Grumann)

使用CSS可以轻松实现。

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>

<style>
    .hidden {
        display: none;
    }

    tr:hover .hidden {
        display: block;
    }
</style>

<table>
    <tr>
        <td>Row 1 Column 1</td>
        <td class="hidden">Row 1 Column 2</td>
        <td>Row 1 Column 3</td>
    </tr>
    <tr>
        <td>Row 2 Column 1</td>
        <td class="hidden">Row 2 Column 2</td>
        <td>Row 2 Column 3</td>
    </tr>

</table>

</body>
</html>

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章