低碳生活主题网站的制作ppt课件

网页设计和设计说明书的制作，名称：杜义学编号： 201092130104指导教师：赵艳完成日期： 2012.6.20，1，1，目录，2，目录，3，目录，4，1，选题和要求，选题“低碳生活”主题网站的制作难易度：要求1，内容详细，上下文明确。 网站创建一次后即可使用。 每个站点至少包含15个静态页面。 二、需要网站规划设计说明书，包括网站主题、定位、样式、网站页面框架结构(一式两份、电子一份、文本一份)。 三、首页的基本形态设计包括颜色、框架、样式等(一式两份、电子一份、文本一份)。 四、网站定位准确，风格清新，色彩合理，动画色彩明亮，动态要求符合网站整体风格。 五、网站设计应以新颖、独特、美观为主。 色彩鲜明和谐，网站动态效果明显，富有创造性。5、6、网站的内容实际上要求。 文字清楚，画得雅致清晰。 绝对不允许使用不文明的文字和画像。 如有违规，考试成绩不及格。 七、网站的所有素材，成员可以使用各种手段和工具自己进行检索。 数码照片，扫描照片，自己用图像编辑软件编辑制作。 八、网站文件和文件的命名和目录结构必须符合理论讲义的规定。 否则成绩就会被处理不及格。 九、网站选题完成后，如有困惑和疑问可咨询代课教师，但必须满足选题要求。 在网上可以参考同一主题和同一种类的网站制作。 十、网站制作分组完成，每组一人。 十一、十四周提交设计计划书和网站主页，不符合要求，重新设计。 十二、每个题目难易度不同，评分时难易度高的题目有难易度加项目，难易度平均为两分。 (附表见下表2 )。 十三、网站完成，使用的文件均须提交。 六、二、设计理念主题释义，随着人类生活的发展，倡导绿色生活、低碳经济。 我们越来越感觉到环境给我们带来的压力和责任。 为了参与绿色军队，环境时空网基于网页制作软件，简单地制作了明确的环境保护网页，介绍了环境保护的历史发展、生活中环境保护的小知识，以及与我们密切相关的生活-衣食住宅中环境保护知识、环境保护的法律政策。 希望通过本网站的宣传，提高我们每个人的环境保护理念、环境保护的法律政策。 希望通过本网站的宣传，提高我们每个人的环境保护理念，成为环境保护良好的市民。 此外，在第11章的内容中，简单介绍了软件DreamweaverCS3的操作和代码的含义、软件Photoshop的简单操作和CSS的应用，以理解简单的静态网页的制作和构成为目的。 最后，总结了这次网页制作的全过程心得，在今后的网页制作中积累了经验。 7、3、LOGO、LOGO是网站的标志，也是网站形象的重要表现。 浏览标志，就会想到网站的品牌，比如百度和谷歌。 他们网站的标志是自己品牌的表现。 是个好标志。 我们可以知道这个网站的类型和内容，例如马铃薯网站的笑容标志，知道是视频网站。 特别是在充满各种标志的网页链接中，这一作用更加明显，因此使用网站标志的设计很重要的标志来推广自己的网站，进行品牌建设也是普及过程中不可缺少的，本网站标志的左侧是运动球，低碳是全球性的概念右侧是网站名称“中碳”和网站名称，网站名称由英语“low”(低、低)和汉语拼音“tan”构成。 下图：8，4，样式，色调，场地主要色调为绿色，以深浅不同的白色和绿色辅助。 绿色是植物的颜色在中国文化中具有生命的意义，绿色也是环境保护的象征和平、友好。 把绿色作为低碳世界环保生活的主要色调是不合适的。五、布局主页：宽953px高2961px宽953正好可以显示在正方形画面上，不生成水平滚动条，易于阅览。 我正在做正规的官方网站，所以页面的内容很多，高度有点大。 设计以箱模型为主，表格为辅，采用css的链接式和嵌入式协作二级网页：内容网页介绍，会员服务网页：注册网页：为了与主页风格保持一致，还是以模型为主，表格为辅助布局方式。 登录管理页：页面简洁，只设置了登录的帐户和密码。 9、6、软件工具、使用Dreamweaver8.0、flash、AdobePhotoshopCS3和Photoshop处理图像，并使用flash创建动画效果、资料整合、10、7、设计流、1、2、3、4、5和FW 切片导出、调试、首页制作、内容页制作链接、检查调试、总结提交：主题的确定、相关资料的检索、资料的分类整理、6，11，8，web站点的结构屏幕预览、，web站点美空调广告，文章检索栏，登录栏，低碳宣传动画，广告，内容盒，内容盒，主页屏幕快照，12，网站的结构屏幕预览，友情链接，内容盒， 广告、支持的浏览器版本和画面分辨率、着作权等信息、主页的屏幕截图、13、9、网站特征、1、主题是围绕低碳世界环境保护生活和可持续发展的“碳足迹”的概念介绍人们的生活对全球变暖的影响在现代生活中，人人都认识到，在这个世界上留下碳足迹，提倡减少碳足迹的低碳生活有助于唤醒人们的环境意识和责任。 2、文章检索栏和友谊链接栏不仅提供国内外着名的低碳/环境相关网站的链接，还附上本人对该网站的简要介绍，使访客能够直观选择和阅览相关网站。 细节认真谨慎。14、登录栏、LOGO、一级导航、美空调广告、文章检索、低碳动画、低碳新闻、专题、人物、广告、推荐企业、产品、市场、项目、商机、产品、广告、十、整体设计模型图、性能、回收、节能减排、碳金融、绿色环保、广告、企业新能源，人才招聘，碳技术，标准论文，重点企业连接，低碳展会笔记广告，主页，15，内容页，注册栏，LOGO，一级导航，美空调广告，站内搜索，广告，低碳品牌，详细内容介绍，关注排名，在线评论，相关阅读，产品，重点企业连接， 用户注册页面、注册栏、LOGO、一级导航、美国空调广告、注册信息的填写、会员服务、重点企业连接、广告、16 11、详细设计和解决问题，具体为共20页网页、index0、index1insex2、index3、index 4335433 以首页index0为例，主页登录栏中的代码包括：用户名：密码： 17、主页|会员服务|登录服务|公开信息|主页|联系人：18、表单使用表单或包含表单要素的区域表单元素是用户可以在表单中输入信息的元素。 例如，文本字段、下拉列表、单选框和复选框。 窗体是使用窗体标记()定义的。 表单可以使网页交互，从而增强功能。 对于没有框线的图像，在图像中追加指定颜色的框线直接插入网页，显示效果相当差。 这里有Border属性，您可以直接设定边框的宽度。 颜色是什么？ 面板没有颜色的选择啊，其实这里有技术问题。 请注意，使用鼠标选择图像对象，然后通过拖动而不是单击来选择图像对象。 可以设定文字的颜色。 添加、19、照片或链接字符的提示信息在我们浏览网页时，如果鼠标停留在图像对象或链接的上方，则在鼠标的右下方可能会显示提示信息框。 给目标加一定的注释。 在某些情况下，其作用至关重要。 首先，在添加图像提示信息并选择图像对象时，“属性”面板中会出现一个Alt输入框。 默认情况下，此输入框为空。在这里输入必要的提示即可。 创建链接提示并不那么容易。 DW没有直接提供这个功能，需要通过追加HTML代码来实现。 将title属性添加到。 title=提示的内容即可。 网页被加载时，像很多商务网站一样广告窗口弹出，在很多大型商务网站中都很常见。 在DW中，通过Behavior行为可以简单地实现。 20、若是加载时，则网页整体的内容可以作为事件的对象。 在DW编辑窗口中，用鼠标单击左下角的选项卡，可以看到选择了所有页面内容。 也可以通过单击快速启动板上的“Behavior”按钮访问“行为”面板，然后选择“OpenBrowseWindow”项来自定义窗口样式，如保留大小和工具按钮。 另一点是，不忘记对应的事件是“Onload”，自动更新网页，插入/html/标题标记/更新后插入。 也可以插入作者和网页的说明等。 21、在定义网页的关键字(Keyname )用户使用搜索引擎对合适内容的网页进行搜索时，关键字起着不可忽视的作用。 许多搜索服务器每隔一段时间自动检测网络上是否生成了新网页，并按关键字进行记录，以便用户能够轻松地进行搜索。 当然，我想在搜索引擎的搜索结果列表中显示网页，关键词的定义很重要。 在“头”面板的部分，单击 Keywords 按钮并输入需要单独定义的关键字。 每个关键字都包含“； (注意编号是分隔的，数量没有限制。) 在、22、水平线的设定颜色DW中，从菜单“insert-horiznalrule”插入水平线后，便可看出“属性”面板中没有水平线的颜色设定。 第一个NC不支持标记hr (水平线的HTML代码)的COLOR属性，因此也不将其设置为DW。 如果需要，似乎只能直接访问和修改源文件。 hrcolor=在对应颜色的代码浏览器中变更鼠标的“形状”一般来说，鼠标在浏览器中以“箭头”的样式出现，变更鼠标的形状在DW中以“CSS样式表”实现。 23、网页链接自定义页面中可以自由跳转的链接可以通过插入命名标记来实现。 类似目录的列表使您可以轻松跳转到页面的任何部分。 此列表专门为“长内容”网页设计。 首先，确定链接指向的位置，即屏幕跳跃后的停留位置。 电子邮件链接是指“电子邮件链接”，单击后浏览器会自动调用默认使用的邮件客户端，键入“问题邮件”，拖动鼠标选择，切换到属性面板，在LINK输入框中键入“Mailto:XXX” 其中Mailto表示邮件链接的协议，Subject表示邮件标题，bc表示同时cc的邮件地址，bcc表示邮件。 在选择了图像后，可以通过属性面板来链接到整个图像的链接，如果选择了图像部分的链接，即图像“热点”，则在属性面板的左下角有“Map”工具栏，其右侧有三个用于包围不同区域的按钮。 以其中的矩形工具为例，选择后鼠标停留在图像上以一种形式显示，表示可以左右拖动，完成后可以按顺序完成到多个热点区域的链接。 请注意不要使各区域重叠。 4 .制作细线表制作1行1列的表，将其“Border”的值设定为1即可。 实际上，用这个方法制作的表格，不是框架为1的方格，而是“粗”的比较多！ 同样地，插入一行一列的表，并将表的border、cellpadding设置为0，将cellspacing设置为1。将表格的bgcolor设定为红色(边框颜色)，同时将储存格的bgcolor设定为白色(即背景色)，25、同样制作宽度为1的细线，不是原封不动地插入，而是主要是插入后太粗，没有必要的细线！ 插入后，将“Height”的高度设定为1，可产生宽度为1的细线。 分离Css样式的使用、Css样式的使用、表现和内容。 通过将设计部分分离并放入独立样式的文件中，可以减少将来网页失效的可能性。 此外，还可以让页面的字体更美丽、更容易布局，让页面更有趣。 您可以同时更新许多页面的样式，而不需要逐页更新。 您可以通过CSS文件控制站点的所有页面样式。 更改此CSS文件的相应行将更改整个站点的所有页面。 强大的字体控件和合成功能。 CSS优于控制字体能力差的字体标签。 如果有CSS，就不需要使用字体标签或透明的1pxGIF图像来控制标题，或者改变字体的颜色或字体样式。 26、库和模板使用模板是设计固定页面布局的特殊类型的文档。 如果您可以使用范本一次更新多个页面，而且您需要建立大量与版面几乎相符的页面，则范本可以大幅提高建立页面的效率。 在设计模板时，可以在基于模板的文档中指定用户为“可编辑”的内容。使用模板时，可以控制模板用户可以编辑的页面元素，也可以在文档中设计多种类型的模板区域本地站点使用的所有模板都以. dwt扩展名存储在web站点根目录的Templates文件夹中。 Css栈式样分为内部式样和外部式样，内部式样的导出和外部式样的链接是减少功耗、提高效率的有效方法。 内部样式块对象只能通过添加css样式的文档来实现。 导出为外部样式，链接到外部样式表以创建外部样式表文件(.css )，并使用html link对象。 本页面使用十几种内部css样式和三种外部样式。 27、本网站的主页index0.html和模板index.dwt为例进行说明。 在模板页面顶部有一个导航栏，单击每列的名称可显示相应的辅助页面，辅助页面的布局与此页面相同。 该网站由不同格式的嵌套组成，顶部是网站徽标和搜索条、导航条，每个子页面与主页面布局相同。 Dreamweaver模板可以将网页布局和内容分离，并且可以将一个页面另存为模板，以便从模板创建具有相同布局的页面。 这不仅提高了网页的创建效率，而且确保了网页的一致性和一致性。 要创建模板，请从现有文档创建模板，或者从新创建的空白文档创建模板。 您也可以从资源面板建立范本。28、库是一个特殊的Dreamweaver文件，其中包含为放置在网页上而创建的单个资源或资源副本的集合。 7.3.1库项目概述库的所有资源称为库项目。 如果您只是希望页面的标题和脚注相同，但页面布局不同，请使用库项目保存标题和脚注。 库项目是可在