dw怎么设置五秒自动换照片

 时间:2024-10-12 21:08:26

1、双击打开Adobe Dreamweaver CC 2018工具,新建文档,输入标题,然后单击创建按钮

dw怎么设置五秒自动换照片

2、点击插入菜单,插入一个Image元素,像这样插入五次,选择不同的图片

dw怎么设置五秒自动换照片

3、插入五张图片后,实时视图从上至下依次显示五张图片(实际大小)

dw怎么设置五秒自动换照片

4、切换到代码视图,利用img元素选择器设置图片宽度、高度和浮动属性

dw怎么设置五秒自动换照片

5、在五个img外层添加两个div标签,依次嵌套;设置最外层div元素宽度、高度、隐藏滚动条和外边距

dw怎么设置五秒自动换照片

6、保存代码到指定路径下,然后直接打开浏览器预览,现在只看到一张图片

dw怎么设置五秒自动换照片

7、在img外层的div,设置宽度为400*5=2000px,animation动画效果五秒;使用@keyframes,设置移动距离

dw怎么设置五秒自动换照片

8、再次保存代码并刷新浏览器,可以看到图片(照片)五秒自动换

dw怎么设置五秒自动换照片
  • dw怎么做图片自动轮播
  • dw图片滚动效果怎么做
  • dw怎么添加搜索框
  • Dreamweaver代码-鼠标经过时更换图片
  • 如何在DW中插入音乐
  • 热门搜索
    祖国建设新成就手抄报 庆元旦手抄报图片 绿色环保手抄报图片 防控疫情手抄报内容 手抄报清明节 妇女节手抄报内容50字 教师节的手抄报 抗击病毒手抄报 手抄报图片大全5年级 热爱劳动手抄报