多语言展示
当前在线:1523今日阅读:91今日分享:37

Dreamweaver 如何展现手风琴图片的交互效果

网页的浏览交互效果会使人感到爽心悦目的感觉,不至于那么乏味。
工具/原料
1

Dreamweaver

2

div+css3

方法/步骤
1

【第一步】打开Dreamweaver cc  2014软件,选择建立html界面,里面自动生成一些必要代码的代码格式,节省时间。

2

【第二步】先保存代码到一个建好的文件夹里,里面的已有准备好的将要做效果的图片的文件夹。

3

【第二步】在body标签内输入:

     
  • 图片
  •  
  • 图片
  •  
  • 图片
  •  
  • 图片
  •  
  • 图片
  •  
  • 图片
注意,src的文件路径的图片位置和图片命名都要一一对应。

4

【第四步】在body标签前面位置,输入:;输入完后,摁F12键,弹出页面,可以看到图片。

5

【第五步】弹出页面后,鼠标移到图片上面左右移动,就可以看到图片滑动效果。

注意事项

这就css3的动画效果,但要注意浏览器的兼容性

推荐信息