《项目四、网页文本内容的排版设计L.pptVIP

知识点回顾 1、段落标记和换行标记分别为？ 2、如何设置表格的边框颜色和边框大小及表格的居中方式？ 3、colspan和rowspan是什么属性？用作什么？ 4、页面的背景图片怎么设置？ 5、表单标记是什么？input标记的作用？ 1．设置文本的字体、大小和颜色 2．设置字体样式 知识扩展：相对路径和绝对路径 学生任务 制作“宇泽电子科技有限公司”网页，要求用div+css布局的方法设计并制作网站子页面，要求制作的页面包含背景图像，文本标题，文本段落，无序列表等元素。 * Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 网页文本内容的排版设计 项目四 学习目标： 1、掌握如何编辑文本、图像及列表 2、合理的对文本、图像等内容的编排做出图文并茂的网页。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 模块一 编辑页面元素 模块二 格式化文本 ● 项目概述 教学进程 模块三 列表 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 编辑页面元素 模块一 知识要点： 添加文本 插入特殊符号 插入日期与水平线 插入图像 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 教学进程 ● 1、添加文本 1．直接输入文本 2．复制并粘贴文本 对于页面中文字内容较多的段落文本，可以先从其它应用程序中复制文本，然后切换到Dreamweaver中，将插入点定位在“文档”窗口的“设计”视图中，最后在菜单栏执行“编辑”→“粘贴”或“编辑”→“选择性粘贴”，即可将文本粘贴到Dreamweaver中。 3．从Word导入文本 对于一篇排版完成的整篇文章，可以使用Dreamweaver的导入Microsoft Office文档功能将其一次性导入。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 教学进程 ● 2、插入特殊字符 1．插入特殊字符 2．插入空格 按下组合键〈Ctrl+Shift+Space〉，或者在“插入”面板“文本”类别的“字符”下拉菜单中，选择“不换行空格”选项，即可插入多个空格。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 教学进程 ● 3、插入日期和水平线 1．插入日期 Dreamweaver提供了一个方便的日期对象，该对象使设计人员可以以喜欢的格式插入日期，并且可以选择在每次保存文件时都自动更新该日期。 2．插入水平线 水平线可以分割页面内容，它对于组织信息十分有用，设计者可以使用一条或多条水平线以可视方式分隔文本和其他对象。 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011 Aspose Pty Ltd. 教学进程 ● 4、插入图像 Web上常用的图像格式包括以下3种：GIF、JPEG和PNG。 Dreamweaver能够使用GIF、JPEG或PNG格式打开或预览任何图像。使用Dreamweaver将一个图像插入到网页中有3种方法： ? 在插入面板的“常用”分类中选择“图像”按钮； ? 执行“插入”→“图像”命令； ? 使用〈Ctrl〉+〈Alt〉+〈I〉组合键。 在页面中插入图像要先将图像文件保存于当前站点内，如果不在当前站点内会导致浏览页面时图片无法显示 案例1、美食之家 Evaluation only. Created with Aspose.Slides for .NET 3.5 Client Profile . Copyright 2004-2011