Dreamweaver中banner两侧的按钮怎么添加?
百度经验 发布时间：2018-06-07 09:28:33 作者：患者无薪 
我要评论
我要评论Dreamweaver中banner两侧的按钮怎么添加？Dreamweaver网页中的banner想要添加按钮，该怎么在banner左右两侧添加按钮呢？下面我们就来看看详细的教程，需要的朋友可以参考下
Dreamweaver网页中的banner图片需要切换，我们可以添加按钮来切换图片，下面我们就来看看详细的教程。
1、准备好一张banner素材，如图，放在img图片库中
2、打开Dreamweaver软件，ctrl+n新建一个html文件并保存
3、在body中建立内容构建内容框并设置类名称
<div class="banner">
<img src="img/banner.jpg" >
<input type="button" value="左" class="bt_left">
<input type="button" value="右" class="bt_right">
</div>
在一个大框中包含图片和两个方向键，最后将左右定位到左右位置
4、在head下加入style标签，对banner设置宽高属性值：
<style>
.banner{width:1200px;height:300px;margin:0 auto;overflow:hidden;}
.banner img{width:100%;}
</style>
5、对大框banner设置为相对定位，设置左侧按钮绝对定位，并设置位置
.bt_left{position:absolute;top:50%;left:20px;}
6、对右侧按钮设置绝对定位，并设置位置
.bt_right{position:absolute;top:50%;right:20px;}
以上就是Dreamweaver给banner添加左右按钮的教程，希望大家喜欢，请继续关注脚本之家。
相关推荐：
dreamweaver cs5怎么给网页添加设置为主页的按钮?
相关文章
Dreamweaver怎么输入文本并设置文本样式？Dreamweaver设计网页的时候，想要输入文本并设置文本样式，该怎么设置呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-02-10
DreamWeaver中css代码不换行显示怎么实现？DreamWeaver中css代码是自动换行的，想要让代码一行显示，不换行，该怎么实现呢？下面我们就来看看详细的教程，需要的朋友可以参2018-02-10
Dreamweaver网页怎么输入文本内容？Dreamweaver设计网页的时候需要输入文本，该怎么输入文本呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-02-10
Dreamweaver怎么制作动态导航? dw网页添加动态导航的教程
Dreamweaver怎么制作动态导航？Dreamweaver设计网页的时候，想要制作动态导航，该怎么制作呢？下面我们就来看看dw网页添加动态导航的教程，需要的朋友可以参考下2018-02-10
Dreamweaver插入面板怎么显示为水平插入栏？Dreamweaver中想要将面板中的插入面变其默认停靠位置变成窗口顶部的水平位置，该怎么设置呢？下面我们就来看看详细的教程，需要2018-01-26
Dreamweaver网页怎么添加文本字段？Dreamweaver设计带有用户名密码的登陆页面的时候，需要添加文本字段，该怎么添加呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-01-26
Dreamweaver怎么实现一个网页内包含多个页面的效果?
Dreamweaver怎么实现一个网页内包含多个页面的效果？Dreamweaver设计网页页面的时候，想要一个网页包含多个页面，该怎么实现呢？我们可以使用框架实现，下面我们就来看看详2018-01-26
Dreamweaver表单怎么设置6位数的密码？Dreamweaver中出入的表单想要设置6位数的密码，该怎么设置呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-01-26
Dreamweaver网页中怎么插入命名锚记链接？Dreamweaver设计网页的时候，想要插入命名锚记链接，该怎么使用命名锚记呢？下面我们就来看看详细的教程，需要的朋友可以参考下2018-01-16
dreamweaver怎么新建收藏夹并归类资源？dreamweaver中收藏了很多东西，为了方便查找我们可以根据资源类型归类，下面我们就来看看dreamweaver新建收藏夹并归类的教程，需要2018-01-09
最新评论