《网页制作第三章内容.ppt》由会员分享，可在线阅读，更多相关《网页制作第三章内容.ppt（16页珍藏版）》请在金锄头文库上搜索。
1、网页设计与制作刘瑞新 吴丰 主编机械工业出版社第3章 Dreamweaver CS5基础入门机械工业出版社机械工业出版社引入Dreamweaver是Adobe公司推出的网页制作和网站管理于一身的可视化网页开发工具，使用该软件方便快捷地制作出极具表现力的网页。机械工业出版社机械工业出版社课程目标：课程目标：学习完堂课，你应该可以能够：学习完堂课，你应该可以能够：一、了解网页制作的基本流程。 二、在DW工作环境下制作第一个网页作品。机械工业出版社机械工业出版社3.5 案例：制作第一个网页作品案例：制作第一个网页作品机械工业出版社机械工业出版社一、建筑物建设的一般流程机械工业出版社机械工业出版社二、
2、网页制作的一般流程机械工业出版社机械工业出版社三、布局分析-分析页面的效果图 1、页面布局结构2、页面的高宽度、文字、背景机械工业出版社机械工业出版社四、制作步骤-1.准备材料1、创建站点2、创建空白文档3、创建外部CSS文档4、链接外部CSS文档机械工业出版社机械工业出版社2.搭网页框架6、编写网页的整个结构wrap hearder content footer机械工业出版社机械工业出版社3.添砖加瓦给页面添加内容7、给header、content、footer区域添加上文字。机械工业出版社机械工业出版社4.装饰内部-添加CSS代码8、添加通配的、整个的CSS代码* margin:0px;p
3、adding:0px;border:0px;body background: url(./images/bg.gif) repeat-y top center #eaeaea;color:#3a3a3a;font:12px 微软雅黑, 宋体, Arial, sans-serif;选择器声明属性属性值*是通用元素选择符，匹配任何元素body是标签选择符，匹配元素#header是ID选择符，匹配header元素机械工业出版社机械工业出版社9、添加wrap的CSS代码#wrap background: #FFF;margin:0 auto;padding:1px 5px;width:760px;he
4、ight:850px;机械工业出版社机械工业出版社10、添加header的CSS代码#header background: url(./images/header.jpg) no-repeat;background-position:center;color:#166090;height:250px;margin:0 0 10px;padding:0;#header h1 font-size:30px;font-weight:400;letter-spacing:-2px;margin:0 0 4px 15px;padding:15px 0 0;机械工业出版社机械工业出版社11、添加Conte
5、nt的CSS代码#content line-height:20px;padding:0;height:550px;#content h2 text-align:center;font-size:25px;font-weight:100;margin:8px 0 10px;padding:0;#content p text-indent:2em;机械工业出版社机械工业出版社12、添加footer的CSS代码#footer background:#fff;border-top:2px solid #dadada;clear:both;color:gray;font-size:12px;padding:8px 0;text-align:center;width:760px;机械工业出版社机械工业出版社3.6 实训：扬州的夏日实训：扬州的夏日
