《Dreamweaver课件第2章网页文本操作2.ppt》由会员分享，可在线阅读，更多相关《Dreamweaver课件第2章网页文本操作2.ppt（41页珍藏版）》请在三一办公上搜索。
1、第二章 文本与文档,本章学习要点：网页文档的基本操作网页文档的属性设置插入普通文本、特殊文本网页文本的属性设置插入水平线和时间项目列表的建立方法移动文字的制作方法,第二章 文本与文档本章学习要点：,插入文本,普通文本 特殊文本 在字符之间添加空格上、下标的制作水平线 日期,插入文本普通文本,文本是网页制作的核心内容，Dreamweaver MX 2004允许通过以下方式在Web页中添加文本：直接将文本输入到页面中、从其他文档复制和粘贴文本或从其他应用程序中拖放文本。能够合并到Web页的常见文档类型有ASCII文本文件、RTF文件和MS Office文档，用Dreamweaver可以从这些文档类
2、型中的任何一种程序取出文本，然后将文本插入到Web页中。,文本是网页制作的核心内容，Dreamweaver,普通文本,普通文本是指一般的汉字或英文文本，将光标直接定位到编辑窗口中要输入文字的地方，然后直接输入文字即可插入。 也可在其他文本编辑器中编辑文本（Word、WPS等），然后复制该文字，打开要添加该文字的Web页面，选择编辑粘贴 命令即可粘贴一般的文本。但Dreamweaver不保留在其他应用程序中设置的文本格式，只可以保留换行符。如果想保留文本的格式，可以选择编辑带格式粘贴 命令，如果不想保留文本格式，还可选择编辑粘贴文本 命令。,普通文本 普通文本是指一般的汉字或英文文本，将光标,特
3、殊文本,在Dreamweaver MX 2004中，可以在文档中插入多种特殊符号，如版权复制符号、并列符、注册商标符号等。要插入特殊符号，具体操作如下。 （1）将光标定位到插入特殊字符的位置。 （2）单击“插入”栏中的“文本”选项卡，如图3-1所示。 （3）单击 按钮，展开如图3-2所示的“字符”下拉列表。,特殊文本 在Dreamweaver MX 20,图3-1,图3-2,图3-1图3-2,（4）如果还需要输入其他的特殊字符，可以在“字符”下拉列表中选择“其他字符”选项，打开如图3-3所示的“插入其他字符”对话框。 （5）单击需要的字符后再单击 按钮即可输入相应的字符，如图3-4所示。 也可
4、以选择插入HTML特殊字符菜单命令下的相应命令插入相应字符。,（4）如果还需要输入其他的特殊字符，可以在“字符”,图3-3,图3-4,图3-3图3-4,在字符之间添加空格,Dreamweaver MX 2004的HTML代码只允许字符之间包含一个空格，若要在文档中添加其他空格，必须插入不换行空格，也可以设置一个在文档中自动添加不换行空格的参数选择。插入不换行空格 设置添加不换行空格的参数,在字符之间添加空格 Dreamweaver M,插入不换行空格,插入不换行空格，可执行如下操作之一。在“插入”栏的“文本”选项卡中，单击“字符”按钮，在下拉列表中选择“插入不换行空格”选项。选择插入HTML特
5、殊字符不换行空格菜单命令。 按【Ctrl+Shift+空格键】键输入。 将输入法切换到全角状态再按空格键。,插入不换行空格 插入不换行空格，可执行如下操作,设置添加不换行空格的参数,设置添加不换行空格的参数，具体操作如下。 （1）选择编辑首选参数菜单命令。 （2）在“分类”列表的“常规”选项中选中 复选框。 （3）单击 按钮保存即可。,设置添加不换行空格的参数 设置添加不换行空格的参数，具,添加上、下标的方法,利用标签选择器可以实现上、下标的插入 方法：在快速插入面版中找到 “标签选择器” htmlsup点击“插入”后，输入上标内容，确定即可。 注：下标sub的插入方法同上。,添加上、下标的方
6、法利用标签选择器可以实现上,水平线,水平线对于信息的组织很有用。在页面上，可以使用一条或多条水平线以可视方式分隔文本和对象。 创建水平线 修改水平线,水平线 水平线对于信息的组织很有用。在页面上，可以,创建水平线,（1）在“文档”窗口中，将插入点放在要插入水平线的位置。 （2）执行以下操作之一。选择插入HTML水平线菜单命令； 在“插入”栏的“HTML”选项中单击“水平线”按钮 。,创建水平线 （1）在“文档”窗口中，将插入点放在要,修改水平线,（1）在“文档”窗口中，选择要修改的水平线。 （2）选择窗口属性菜单命令，打开如图3-7所示的属性面板，然后根据需要对属性进行设置。 也可以在图形软件
7、中制作一些矩形条后用插入图形的方法插入到Web页面中，用这种方法做成的水平线更加丰富多彩。,图3-7,修改水平线 （1）在“文档”窗口中，选择要修改的水平,日期,Dreamweaver提供了一个方便的日期对象，该对象使可以以任何喜欢的格式插入当前日期（包含或不包含时间都可以），并在每次保存文件时都自动更新该日期。 将当前日期插入到文档中的具体操作如下。 （1）在“文档”窗口中将插入点放在要插入日期的位置。 （2）执行下列操作之一。,日期 Dreamweaver提供了一个方便的日期,选择插入日期菜单命令； 在“插入”栏的“常用”选项中，单击“插入日期”按钮。 如果选中了 复选框，则在日期格式插入
8、到文档中后可以对其进行编辑，方法是单击已设置格式的日期文本，然后在属性面板中单击 按钮，接着在打开的“插入日期”对话框中重新进行设定即可。,选择插入日期菜单命令；,如果希望在每次保存文档时都更新插入的日期，可选中“存储时自动更新”复选框。如果希望日期在插入后变成纯文本并永远不自动更新，请取消选择该选项。,如果希望在每次保存文档时都更新插入的日期，可,格式化文本,“文本”属性面板中各选项含义及设置方法如下。 格式 样式 粗体 斜体 字体 大小 颜色 对齐方式 链接,格式化文本 “文本”属性面板中各选项含义及设置方法如下。,格式,设置所选文本（一般是标题文本）的段落样式。“段落”是应用标签的默认格
9、式，“标题 1”添加标签，各具体选项如图3-8所示，设置该选项可以将所选的文本设置成各种标题。标题号越小，字体越大。 要设置字体的“格式”属性，只需在“格式”下拉列表中选择相应的选项即可，其效果如图3-9所示。,格式 设置所选文本（一般是标题文本）的段落样式。,图3-8,图3-9,图3-8图3-9,项目列表,有序列表 无序列表 创建嵌套列表,项目列表有序列表,有序列表,有序列表又称为编号列表，是有一定排列顺序的列表，一般前面有数字前导字符，也可以是阿拉伯数字、英文字母、罗马数字等符号。,有序列表 有序列表又称为编号列表，是有一定排列顺,无序列表,无序列表又称为项目列表，是一系列无顺序级别关系的
10、项目文本组成的列表，一般前面是用项目符号作为前导字符。,无序列表 无序列表又称为项目列表，是一系列无顺序,创建嵌套列表,创建嵌套列表的具体操作如下。 （1）选择要嵌套的列表项。 （2）单击属性面板中的“缩进”按钮 ，或选择文本缩进菜单命令。Dreamweaver自动缩进文本并创建一个单独的列表，该列表具有原始列表的HTML属性，如图3-10所示。 （3）按照以上列表的创建方法，对缩进的文本应用新的列表类型或样式。完成的效果如图3-11所示。,创建嵌套列表 创建嵌套列表的具体操作如下。,图3-10,图3-11,图3-10 图3-11,在创建一个页面时，可以先对整个页面进行布局，然后再向页面中填入
11、各种内容。网页布局的方法很多，主要有表格布局、层布局和框架布局3种方式。,在创建一个页面时，可以先对整个页面进行布局，,移动文字的制作,文字Behavior（方式）Scroll:一圈一圈绕着走Slide:只走一次Alternate:来回走Direction:方向Loop:循环次数Scroll amount:速度Scrolldelay:延时,移动文字的制作文字,课后练习,填空题判断题问答题上机操作题,课后练习填空题,填空题,（1）段落对齐有左对齐、右对齐、 和 4种方式。 （2）“文本”属性面板中的 图标可以对所选文本进行 设置，用 图标可以对所选文本进行 设置。,居中对齐,倾斜,两端对齐,加粗
12、,填空题 居中对齐倾斜两端对齐加粗,判断题,（1）Dreamweaver MX 2004中只能进行无格式文本。 （ ）（2）对水平线进行颜色设置后只能在浏览器中才能看到颜色显示效。 （ ）,判断题（1）Dreamweaver MX 2004中只能进行,问答题,（1）如何在Web页面中添加多个空格？ （2）如何添加和删除字体列表项中的字体种类？ （3）如何更改字体列表的顺序？,问答题（1）如何在Web页面中添加多个空格？,上机操作题,1.根据本课所学内容，请读者自己创建一个Web页面，在文档中输入自已的简历，并根据自己的想法添加字体列表、并设置字体的大小、颜色及段落对齐方式。 要求：有上、下标的
13、使用，有竖排文字，日期，水平线等,上机操作题 1.根据本课所学内容，请读者自己创建,第二章 校园网站的制作,第一部分:新建站点网页标题表格的使用制作logo、特效图片制作导航栏建立超级链接并设置样式层的介绍,第二章 校园网站的制作第一部分:,新建站点,请同学在dreamweaver中新建一站点；在dreamweaver中打开站点；在dreamweaver中关闭站点,新建站点请同学在dreamweaver中新建一站点；,网页标题的设置,操作步骤：在空白处点右键网页属性标题 输入网页的标题即可,网页标题的设置操作步骤：,表格,插入表格；注：行数：定义表格行的数目。列数：定义表格列的数目。表格宽度：
14、以像素为单位或按占浏览器窗口宽度的百分比来定义该表格在浏览器中的显示宽度。边框粗细：指定表格边框的宽度（以像素为单位）。单元格边距：确定单元格边框和单元格内容之间相距的像素数。 单元格间距：确定相邻的表格单元格之间相距的像素数。,表格插入表格；,使用fireworks制作logo和特效图,新建文档的方法；调整图象，画布大小；图层的介绍；选择工具；渐变工具的介绍；特效的添加；,使用fireworks制作logo和特效图新建文档的方法；,导航栏的制作,在单元格背景色上添加文字，形成最简单的导航；背景图片上添加文字；软件自带按纽；代码实现图片翻转效果；,导航栏的制作在单元格背景色上添加文字，形成最简单的导航；,超级链接的制作,插入超级链接；设置超级链接文字翻转效果；（页面属性）为超级链接文字设置css样式；,超级链接的制作插入超级链接；,课后作业： 每个同学按照课堂所讲方法，制作“电子信息分院首页”。,课后作业：,
