dreamweaver如何制作图片浏览器

 时间:2024-10-13 22:59:56

1、打开dw,先将页面背景颜色改为黑色,满足我们对美观的要求,你也可以设置为自己喜欢的颜色,点击页面属性即可更改背景颜色。

dreamweaver如何制作图片浏览器

2、​插入一个2行1列的表格,如图所示,猜菜单栏上执行:插入表格,打开插入表格对话框,将表格宽度设置为700像素。​

dreamweaver如何制作图片浏览器
dreamweaver如何制作图片浏览器

3、​我们看到表格已经插入好了,接着选中表格第一行,我们来插入一个图片,如图所示,在菜单栏上执行:插入--图像​

dreamweaver如何制作图片浏览器

4、​图像插入以后,将图像设置为水平居中对齐​

dreamweaver如何制作图片浏览器

5、​接着在表格的第二行插入一个1行3列的表格,如图所示,将光标放到表格的第二行,然后在菜单鲥鲣剔墟栏上执行:插入--表格​。将表格边框设置为10像素,宽度是100%

dreamweaver如何制作图片浏览器
dreamweaver如何制作图片浏览器

6、​将光笔移动到第一个单元格,然后插入一个图片作为缩略图

dreamweaver如何制作图片浏览器

7、​同样的方法,插入三个图片作为缩略图​

dreamweaver如何制作图片浏览器

8、​插入一个ap div,div的大小正好能够覆盖电视机的屏幕,这样我们可以在div里插入图片,显示的效果就是电视机的播放效果了。​

dreamweaver如何制作图片浏览器

9、​插入​一个图片,然后将图片的id设置为dianshi

dreamweaver如何制作图片浏览器

10、​选中第一个缩略图,给它添加一个行为​

dreamweaver如何制作图片浏览器

11、​在窗口菜单,勾选行为窗口​

dreamweaver如何制作图片浏览器

12、​在行为窗口中,点击添加按钮,在打开的对话框中,我们选择【交换图像】​

dreamweaver如何制作图片浏览器

13、​打开交换图像对话框,我们看到这里有dianshi这个图像,选中它,然后再设置为原始档为你要展示的另一个图片,点击浏览按钮即可选择图片,选择好了以后点击确定。​

dreamweaver如何制作图片浏览器

14、​同样的方法给三个缩略图都设置好行为,这样就能够实现图片的切换效果了。​

dreamweaver如何制作图片浏览器
  • Dreamweaver CS3如何插入图像查看器
  • DW如何更改默认的预览浏览器
  • DW制作tab选项卡新闻文字切换jquery效果模板
  • Dreamweaver如何创建基于模板的页面
  • Dreamweaver CS6如何应用:[21]使用单选复选
  • 热门搜索
    端午节英语手抄报 廉洁文化手抄报 谷雨手抄报 手抄报图片大全初一 元旦手抄报图片大全 抗击疫情手抄报简单 手抄报疫情 清明节手抄报模板 国庆节手抄报图片 民俗手抄报