《课文档与文本》PPT课件.ppt

第2课 页面文档与文本,本章学习内容： 1.了解文档和文本，熟悉视图与文档创建。 掌握文本输入方法，熟悉文档保存。 2.重点掌握网页中的文本分段、空格及特殊字符使用与换行 。 3.重点掌握页面设置。 4.重点掌握文本编辑及相关HTML标记。 5.熟悉水平线的应用。 6.了解标尺和网格,2.1 新建文档,1.文档与文本概念 2. 文档的创建方法 3. DW三种视图 4.添加文本方法 5.保存文档方法,1.文档概念,每一个文档就是一个网页，新建文档就是新建一个网页，这里的网页指的是HTML文档。 文档是用来存放信息数据的，这些信息数据指的是网页元素。 网页元素指的是文本、图像、表格、CSS、层、框架、多媒体文件、模板和库等。 所以文本只是文档中的一个组成部分。,2.新建文档的方法,（1）DW主界面中的文件菜单中的新建分类HTML创建。 （2）DW主界面中的起始页创建HTML创建。 （3）目录右键菜单新建文件,3.DW三种视图,代码视图： 显示文档的源代码,可以直接编写代码,适于编程开发人员和能简单编写代码人员。 拆分视图 同时显示文档和源代码,便于理解源代码的含义,提高学习、使用源代码的水平。 设计视图： 仅显示文档,用于编辑和完善网页的美观以及布局的合理性。,4.添加文本,（1）直接输入。 （2）复制网页上的文本 。 （3）复制WORD文档。 （4）文本文件文本。 使用快捷方式： Ctrl+A 全选文本，Ctrl+C复制，Ctrl+V粘贴。 Ctrl+Shift+V选择性粘贴。 （可通过DW的编辑菜单中进行选择操作）,5.保存文档,（1）文件保存(Ctrl+s)。 （2）利用文件下拉菜单中的另存为(Ctrl+Shift+S)。 新建文档文件保存(Ctrl+s)选择保存目录起文件名选文件类型保存 文件另存为(Ctrl+Shift+S)选择保存目录起文件名选文件类型保存 注:文件名最好不用中文,可能会出现乱码或图片不显示等状态.,保存文件名index.html,2.2 文本分段、换行、特殊字符,1.文本分段 2.文本换行 3.插入特殊字符,1.文本分段,分段步骤： （1）光标定位在要分段的文本位置。 （2）使用Enter键，即按回车符换段。（word中是换行不是分段） （3）查看源代码，段落标记,2.文本换行,（1）快捷方式为Shift+Enter键 （2）使用插入面板中的文本选项卡中的 （3）换行符标记,3.插入特殊字符,（1）空格符 A、（ctrl+shift+space）：space指的是空格键 B、C插入面板文本选项卡 HTML标记 4个空格占两个汉字大小。,C、插入下拉菜单,注：其它插入特殊符号方法相似。,（2）版权符号 （3）注册商标 （4）其他特殊字符,2.3 页面设置,1.页面设置方法 2.页面属性设置内容,1.页面设置方法,（1）打开修改下拉菜单中的页面属性设置。,（2）打开属性面板中页面属性设置。,2.页面属性设置内容,外观设置,（1）设置网页字体 （2）字体大小 （3）文本颜色（全局文本颜色即整体页面） （4）背景颜色 （5）背景图像 （6）背景图像重复设置（重复，不重复，横向重复，纵向重复） （7）页边距（上下左右）,设置页边距,默认情况下，Dreaweaver将网页的上边距和左边距定为3个像素。 需要修改左、上边距时，单击“修改”下拉菜单中的“页面属性”，打开“页面属性”对话框来进行修改“左边界”和“顶部边界”文本框中的值，默认为3像素。 如，在“左边界”和“顶部边界”文本框中输入“0”。在代码视图中标记中将添加body margin-left: 3px; margin-top: 3px; margin-right: 3px; margin-bottom: 3px; ,页面属性设置,HTML源代码,2.4文本编辑及相关HTML标记,1.设置文本外观 文本颜色、文字字体、格式化文字、加粗、倾斜。 2.文字排放 块引用格式、设置文字对齐、使用项目列表、序号列表、文本缩进。,1.设置文本外观,（1）文字颜色,局部文本颜色,（2）文字字体,（3）格式化文字,（4）加粗、倾斜,2.文字排放,（1）块引用(整体块) ,（2）设置文字对齐,（3）项目列表,（4）序号列表,（5）文本缩进,综合实例,2.5 水平线,1.插入水平线 DW主界面中插入记录下拉菜单HTML水平线。,F12浏览测试,2.设置水平线,2.6 标尺和网络,标尺和网格是网页的辅助设计工具。 有利于网页格式化内容。 为了方便对网页元素定位，可以显示标尺和网格。,1.标尺,Dreaweaver的标尺显示在文档窗口的上方和左方。 显示/隐藏的方法是：单击“查看”“标尺”“显示”。 标尺显示的度量单位有像素（默认）、英寸、厘米等三种，用户可根据需要更改。 标尺的原点（默认位置：文档的左上角），可以用鼠标拖移。若要恢复到默认位置，单击 “查看”“标尺”“重设原点”。,2.网格,修改网格参数，单击“查看”“网格”“编辑网格”，然后在“网格设置”对话框上设置。 “颜色”，网格线的颜色。 “显示网格”复选框，选中，则显示网格。 “靠齐到网格”复选框，看不出有什么作用。 “间隔”，网格线之间的距离（注意单位） “显示”，网格线显示有两种形