您还没有专辑

开始创建自己的专辑吧

创建
您可在个人中心-我的专辑处查看
当前位置:首页 > 软件入门 > DW-案例制作-banner及关于我们(上)

DW-案例制作-banner及关于我们(上)

手机观看

扫一扫下载虎课app

支持离线缓存,随时随地学习

VIP优惠升级 19大分类,畅享43000+设计教程特权!

为自己充值升华学习
今日剩余学习次数:1

按住画面移动小窗

DW-案例制作-banner及关于我们(上)

播放卡顿?建议切换线路

宽屏取消宽屏

学设计上虎课网

学习意犹未尽?成为VIP,继续提升

免费学习即将结束

关闭继续学习>

发表评论
收起宽屏
分享给朋友:
手机观看

扫一扫下载虎课app

支持离线缓存,随时随地学习

添加到专辑收藏已收藏收藏成功,可进入个人中心-课程收藏 查看!
目录信息笔记
课后练习学员评价 (203条评论)视频字幕查看优秀作品>

课后练习在紧急制作中。。。

课程综合评分:9.8
课程难易程度:太简单(5)简单(41)适中(121)有点难(33)太难了(3)
您需要学习后才可以评价,立即学习
评论列表
仅显示有内容的评论
仅显示带图评论
排序方式:

Hello,大家好我是M ,我们继续上节课的内容,继续来看一下这个 ,科技网站后面的部分 ,上节课呢,我们讲到的是我们整个的导航部分,就是我们这个UL ,好,我们先打开浏览器来重新看一遍 ,导航部分 ,接下来我们要做的就是这个Banner ,Banner ,它 ,这个 ,这一块呢 ,我们可以看作它是一个DIV ,DIV里面呢,加上了我们这个Banner的图片 ,所以呢 ,我们现在要做的就是先把这个Banner图给 ,切出来 ,好,我们直接选中 ,Banner图的这个 ,图层以及它剪切的图层 ,两个选中一起或者呢直接选中这个 ,Banner的文件夹 ,好使用Cutterman把它导出到哪里呢 ,导出到我们的站点,就是之前 ,我们的网站,站点叫做 ,商业网站站点里面的 ,唉,里面没有,我们建一个图片叫Img ,i,m,g ,确定 ,然后 ,导出选中图层 ,好 ,我们可以去到文件夹里面看一下 ,双击网站站点 ,好,这个Banner就已经在这里了 ,好,顺便可以看一下尺寸,1920*508 ,好,我们去到DW里面 ,写Banner部分 ,首先呢,还是给一个注释 ,额,这个呢就是我们的Banner了 ,然后 ,刚刚M分析的首先它是个DIV ,

这个DIV我们就叫Banner好了 ,DIV里面呢是一个Img ,图片 ,然后 ,把它 ,给导入进来 ,这样,我们HTML的结构呢就是这样 ,我们再去修改一下它的样式 ,首先是Banner ,那我们的CSS这边来,.Banner ,这个Banner有一些什么样式呢,我们可以来看一下效果图 ,首先,它的宽度 ,这是满的呀 ,我们可以写1920,当然那也可以写100% ,宽度100% ,高度,高度我们来直接看一下图片上的高度吧,508 ,这里1920*508,508PX ,然后还有什么呢 ,居中对不对,我们要让这个Banner在我们的页面里面是局中的 ,好,这是Img ,上下呢,看一下上下有没有间距 ,上下是没有的,我们是这个是紧贴着我们的 ,导航栏的对不对,所以是上下间距 ,零,左右自动 ,好,保存一下 ,去看一下我们的 ,浏览器里面,刷新一下 ,好 ,然后呢 ,我们给Banner里面的这个Img也就是我们的图片 ,给设置一个居中样式 .banner的img ,margin ,名 ,自动 ,保存一下,刷新 ,好,我们的这个Banner呢就这样完成了 ,接下来我们来看一下设计图 ,

接下来就是这一块 ,关于我们 ,这个关于我们,我们要怎么去写呢 ,首先这一块就是我们现在PS看到的浮动的 ,这一个方块 ,我们首先要把它看做是一个DIV ,然后这个地方 ,有同学可能就要问了下面这一个横线,我们需不需要切图切出来呢 ,这里是不需要的啊 ,这里我们可以怎么写,我们直接写一个 ,边框对不对,下边框 ,就OK了 ,好,我们现在量一下这个DIV ,看一下它的 ,宽,高是个什么样子的 ,宽是1162 ,好,我们来到这边 ,注释一下 ,关于我们 ,About us ,好,Div. ,Aboutus ,我们来的CSS里面 ,.Aboutus ,宽 ,1162对不对,再量一遍 ,忘记了 ,再量一遍这两边,这里一定要注意啊一个方向稳着 ,1162,顺便看一下高好了 ,高我们这里直接量到Banner部分 ,好,宽度1162,高度 ,

登录后查看更多
换一批

为你推荐

每周一练

立即参与

同学,小虎知道你非常努力的想学习!

老师录制课程真的也很辛苦

赞助一下吧

确定学习吗?

您每天可免费学习一个教程。

成为VIP可无限学习 !

成为VIP吧!

成为VIP吧!

您已经免费学习 1 个教程 !

我们录制教程很努力的,赞助下吧 !

升级VIP吧!

您已经学习 5 个教程啦!

我们录制教程很努力的,赞助升级下吧 !

您已经累计下载5个源文件


您在当前分类下不是VIP,赞助VIP享受无限下载


您已经累计下载5个素材文件


您在当前分类下不是VIP,赞助VIP享受无限下载


您已经累计下载5个源文件


您在当前分类下不是VIP,赞助VIP享受无限下载


您已经累计观看5个图文教程


您在当前分类下不是VIP,赞助VIP享受无限观看


学习后才能评价哦!

学习后才能提问哦!

获得30虎课币

评论提交成功,将在审核通过后显示

×

下载素材/源文件:

收藏成功
取消成功
特惠
充值
客户端
虎课桌面客户端
置顶播放器,边看边学习
虎课移动APP
支持离线缓存,随时随地学习
我的排行
建议意见
官方客服

官方客服

您可以与在线客服进行沟通或者拨打客服热线获得帮助

客服热线:021-80344319工作日:9:30-18:30

在线咨询:联系客服工作日:9:00-22:00

节假日:9:00-18:00

虎课积分
登录注册
使用手机号码登录
使用手机号码登录
手机号码格式错误
换一个
图形验证码错误,请重新输入
验证码错误,请重新输入
登录
已连续签到0
第一天
5个虎课币
第二天
10个虎课币
第三天
15个虎课币
第四天
20个虎课币
第五天
40个虎课币
第六天
20个虎课币
第七天
20个虎课币
立即签到
已签到
每周一重置签到奖励
已连续签到0
本周斩获110个虎课币,下周也要来哦
我知道了
已连续签到0
哎呀,签到失败了!
再次签到
哎呀,系统出现错误,请稍后重试!
上上签 · 今日宜学习
恭喜!签到成功,获得 10 个虎课币
.
书山有路勤为径,学海无涯苦作舟
— 唐代文学家 韩愈
虎课网 · 每天进步一点点
分享到