要实现表格行的格式化且保留悬停效果,可以通过CSS中的伪类选择器来实现。下面是一个示例代码:
HTML代码:
单元格1
单元格2
单元格3
单元格1
单元格2
单元格3
单元格1
单元格2
单元格3
CSS代码:
tr.row-format {
background-color: lightblue;
}
tr.row-format:hover {
background-color: darkblue;
color: white;
}
在上述代码中,我们给希望格式化的表格行添加了一个类名 "row-format"。然后,我们使用CSS选择器 .row-format
来选择所有带有该类名的表格行,并设置其背景颜色为浅蓝色。
此外,我们还使用CSS伪类选择器 :hover
来设置鼠标悬停时的样式,将背景颜色改为深蓝色,并将文字颜色设置为白色。
这样,当鼠标悬停在带有 "row-format" 类名的表格行上时,该行会按照设置的样式进行格式化,并保留悬停效果。而其他没有 "row-format" 类名的表格行则不会受到这个样式的影响。
请注意,在使用上述代码时,将其放置在 标签内或外部的 CSS 文件中,并在 HTML 中引入该样式文件。
上一篇:表格行根据最低值改变颜色
下一篇:表格行号自动刷新/更新