Dreamweaver网页页面中的banner图片必须切换,我们可以加上按键来切换图片,下边大家就讨论一下详尽的实例教程

软件名称:AdobeDreamweaverCC2018V18.0中文/英语绿色版32/64位手机软件尺寸:968MB更新:2017-10-19立即下载

1、准备好一张banner素材图片,如图所示,放到img图片库文件

2、开启Dreamweaver软件,ctrl n在建一个html文档并储存

3、在body中创建內容搭建內容框并设定类名字

<divclass="banner"> <imgsrc="img/banner.jpg"> <inputtype="button"value="左"class="bt_left"> <inputtype="button"value="右"class="bt_right"> </div>

在一个大框中包括图片和2个键盘按键,最终将上下精准定位到上下部位

4、在head下添加style标识,对banner设定高宽特性值:

<style> .banner{width:1201080x;height:301080x;margin:0auto;overflow:hidden;} .bannerimg{width:100%;} </style>

5、对大框banner设定为相对定位,设定左边按键绝对定位,并设定部位

.bt_left{position:absolute;top:50%;left:20px;}

6、对右边按键设定绝对定位,并设定部位

.bt_right{position:absolute;top:50%;right:20px;}

之上便是Dreamweaver给banner加上上下按键的实例教程,期待大伙儿喜爱,请再次关心。