dw中如何设置鼠标经过时显示图片?

周文博            来源:优草派

Dreamweaver(以下简称DW)是一款流行的网页设计软件,拥有丰富的功能,其中就包括鼠标经过时显示图片。那么,具体如何设置呢?

dw中如何设置鼠标经过时显示图片?

1. 使用CSS设置

通过CSS设置可以精细地控制鼠标经过时显示的图片。方法如下:

1) 在标签中添加CSS代码。

例如:

2) 在标签中添加HTML代码。

例如:

3) 运行网页,将鼠标移到‘img’上,就会发现鼠标经过时图片变为picture2.jpg。

2. 使用DW内置工具

除了使用CSS,DW还有自带的内置工具来设置鼠标经过的图片。方法如下:

1) 首先,在DW中打开相应页面。选择要添加鼠标经过图片的元素。

2) 点击“属性检查器”下拉菜单选择“交互”选项卡,选择“鼠标移上时”或“鼠标移开时”,并点击“加菜单”图标,“加菜单”可添加预设的特效,例如渐隐渐显、弹出或变大缩小。

3) 选择“图片操作”并勾选“切换图像”框,指定鼠标移上去时的图片路径。完成后保存,再次预览即可。

值得注意的是,鼠标经过图片不宜过大和过多,否则会影响页面的加载速度和用户体验。同时,为了提高兼容性,建议使用较小的gif格式图片。

【原创声明】凡注明“来源:优草派”的文章,系本站原创,任何单位或个人未经本站书面授权不得转载、链接、转贴或以其他方式复制发表。否则,本站将依法追究其法律责任。
TOP 10
  • 周排行
  • 月排行