最新下载
热门教程
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
实例讲解:CSS制作鼠标经过改变表格背景属性
时间:2008-01-26 编辑:简简单单 来源:一聚教程网
这份教程将教会你下面的技巧:当鼠标移至表格(单元格)上方时,改变表格的背景颜色。
首先,在你的页面上创建一个菜单;然后,创建两种用于鉴别的颜色体:一个是表格的初始颜色,另一个是鼠标移至表格上方时所产生的背景颜色。在我这个案例中,我所默认使用的背景效果颜色(鼠标以上去时)是:#999999,初始颜色是:#CCCCCC。
现在,将下面这段代码复制到文档头部。(位于
代码如下 | 复制代码 |
将蓝色改变为你所需要的颜色。
td.off意指表格的初始颜色,这里设置的初始值是#CCCCCC。
td.on意指鼠标移动至表格上方时显示的颜色,这里设置的值是深灰色(#CCCCCC)。
现在,我们需要做的是将这段CSS代码应用到已经创建的表格中。将下面这段代码插到表格中的每个
加入后的代码如下所示:
让我们逐行理解下面的这段代码:
代码如下 | 复制代码 |
onmouseover="this.className='on'" ——当鼠标移至表格中的每列单元格之上时,所对应的CSS的效果。 onmouseout="this.className='off'"> ——当鼠标从表格中的每列单元格上移开时,所对应的CSS的效果。 |
相关文章
- 使用css的放射渐变实现光影效果实例 12-17
- css实现首字下沉实例代码 09-06
- CSS实现平滑伸缩的搜索框实例 06-01
- css 在ie下 inline-block用法实例 01-19
- CSS text-align 文本对齐实例 09-12
- css 文章内容排版实例 03-23