利用CSS实现鼠标移动到导航栏时对应栏目自动变色

1、在右边的CSS样式面板中点击新建CSS规则按钮,如下图所示:

2、新建CSS规则的选择器类型为“复合内容(基于选择的内容)”,选择器名称为.curtd:hover,如下图所示:

3、在规则定义对话框中点击背景分类,然后设置背景颜色(Background-color)为想要的颜色,如下图所示:

4、选中栏目对应单元格的<td>标签,在属性面板中点击HTML,其中的类选择curtd,每个栏目都是这样设置,如下图所示:

5、保存页面后,在浏览器显示页面,把鼠标放到对应栏目,就可以看到该栏目的背景颜色变为了指定的颜色,点击查看效果

6、本例中所定义的CSS样式规则如下:

<style type="text/css">
.curtd:hover {
  background-color: #F96;
}
</style>