《电子商务网页制作 教学课件 ppt 作者 谢嵘 04》由会员分享，可在线阅读，更多相关《电子商务网页制作 教学课件 ppt 作者 谢嵘 04（29页珍藏版）》请在金锄头文库上搜索。
1、主编：谢嵘,在我们所知道的网页中，有着丰富的内容，其中文字是必不可少的。在看这些文字的过程中，大家会发现，网页上的有各种各样的文字，大的、小的、红的、蓝的、粗的、细的等等，这些不同样式的文字，使得原本很单调的文本内容丰富了起来，人们在阅读的时候，对着不同的文字，有着不同的心态。那么这些不同的文字是如何做出来的呢？ 本项目从文字方面入手，介绍了文本添加的方式以及对添加的文本如何来进行编辑。,项目4 美化网页文本,项目导学,体验活动一：在网页中添加“本站信息”页面文本,活动任务： 在网页中直接输入文本信息；粘贴其他文本中已经存在的文字信息到网页中；导入外部文档。 活动指导： 文字是从什么地方来的呢
2、？第一种，可以通过直接在网页上输入文字来获得；另外，还可以通过复制其他文本信息（如 Word、记事本和 Excel 等），然后粘贴在网页中来添加“本站信息”页面文本；除了以上两种插入文本信息之外，还可以通过直接导入已经存在的Word文档信息来输入网页内容。,项目4 美化网页文本,体验活动一：在网页中添加“本站信息”页面文本,活动步骤： 启动Dreamweaver CS4软件。新建一个HTML网页，在“设计”页面中直接键入中文内容。 将其他应用程序（如Word）中的文本内容进行复制，然后在“设计”页面中将复制的内容进行粘贴。,项目4 美化网页文本,体验活动一：在网页中添加“本站信息”页面文本,活
3、动步骤： 在“设计”页面中，点击“文件”菜单，选择“导入”，在出现的下一级菜单中选择“Word文档”。 在弹出的“导入Word文档”对话框中，选择需要添加的一个Word文档，然后点击“打开”，即可将文档导入到网页中。,项目4 美化网页文本,体验活动一：在网页中添加“本站信息”页面文本,活动步骤： 最终效果，如图所示。,项目4 美化网页文本,活动小结,在完成了以上体验活动后，根据体验后的感受，写出以下三种文档分别选择哪种插入方式，填写下表,项目3 用表格布局网页,三种文字的插入方式,体验活动二：设置“本站信息”中的文字的样式,活动任务： 设置字号、字体颜色和显示位置。 活动指导： 设置标题“本站
4、信息”为黑体，红色，24号字，居中显示；在以下讲解的设置中，如果弹出创建CSS的对话框，在“选择器类型”下拉菜单中，选择“类（可应用任何HTML元素）”，而“选择器名称”的下拉菜单中，输入“.style”，然后点击确定。,项目4 美化网页文本,体验活动二：设置“本站信息”中的文字的样式,活动步骤： 选中“本站信息”，在“属性”页面，点击“字体”的下拉列表，选择“编辑字体列表”。 在弹出的“编辑字体列表”中，选择“黑体”，添加到“选择的字体”中。,项目4 美化网页文本,体验活动二：设置“本站信息”中的文字的样式,活动步骤： 在“颜色”下拉菜单中，选择红色，在“大小”选项框中，选择字体大小为“24
5、”号字，并点击“居中”按钮。 最终显示效果如图所示。,项目4 美化网页文本,体验活动三：处理表格中的数据,活动任务： 用表格工具处理数据，对数据进行排序操作。 活动指导： 学习新的新建页面的方法和打开方法。在实际工作中，利用“文件”面板来完成这样的工作更便于对页面的管理，不容易造成页面保存路径的出错。,项目4 美化网页文本,体验活动三：处理表格中的数据,活动步骤： 选中需要编辑的段落，点击鼠标右键，在弹出的对话框中选择“段落格式”，在下一级菜单中选择“标题1”。 选中需要编辑的段落，按照上面的方法，在弹出的“段落格式”中，选择“标题2”。,项目4 美化网页文本,体验活动三：处理表格中的数据,活
6、动步骤： 在第二段文字后，按shift+enter键，换行输入以下文字，可以看出，换行和段落相比，换行的间距比段落小很多。 也可以使用“文本”工具栏中的“BR”来进行换行。将光标插入到需要换行的文字前面。,项目4 美化网页文本,体验活动三：处理表格中的数据,活动步骤： 在弹出的下拉列表中，选择“换行符”。 最终效果，如图所示。,项目4 美化网页文本,体验活动四：在网页中添加特殊字符,活动任务： 在网页上引用特殊字符。 活动指导： 我们在浏览网页的时候，可以看到网站上有一些特殊的符号，那这些符号又是怎么来的呢？,项目4 美化网页文本,体验活动四：在网页中添加特殊字符,活动步骤： 在需要插入特殊字
7、符的地方点击鼠标左键，然后点击菜单“插入”中的“HTML”在下一级菜单中选择“特殊字符”。 按照上面的方法，试一下其他的每一种特殊字符。,项目4 美化网页文本,体验活动五：设置“本站信息”内容为列表样式,活动任务： 在网页中使用列表。 活动指导： 在网页内容中，为了将主题或数据与文档分开，一般采用列表来区分它们。,项目4 美化网页文本,体验活动五：设置“本站信息”内容为列表样式,活动步骤： 项目列表。选中需要进行区分的文档，点击右键，选择“列表”，在出现的下一级菜单中选择“项目列表”。 按照上面的方式，在“列表”弹出的下一级菜单中，选择“编号列表”。,项目4 美化网页文本,体验活动五：设置“本
8、站信息”内容为列表样式,活动步骤： 最终显示效果，如图所示，由此可见，列表只能针对段落有效，而对换行的文字，是不能形成列表样式的。,项目4 美化网页文本,活动小结,在完成了以上体验活动后，根据体验后的感受，填写下表。,项目3 用表格布局网页,相关知识,一、插入文本 在网页的制作过程中，文字信息必不可少，这里介绍了3中插入文字的方法： 在网页中键入文本； 从其他应用程序（如 MS-Word、记事本和 MS-Excel 等）复制并粘贴文本； 将 Word 文档导入 Dreamweaver；,项目4 美化网页文本,相关知识,二、编辑文本 在插入了文本后，为了使文本更加生动，通常我们都会进行一定的修改
9、，是文字呈现出不同效果。 对文字的修改可以使用“常用”工具栏上的“文本”工具栏。,项目4 美化网页文本,相关知识,二、编辑文本 修改字体设置： 一般情况下，输入文字的字体都是设置为“默认字体”。若想要修改字体，选中需要修改的文字，点击图中“默认字体”的下拉箭头“”，选择其他的字体样式。,项目4 美化网页文本,相关知识,二、编辑文本 修改字体样式： 默认设置的字体都是没有样式的，如果想要将标题文字加粗，先选中标题文字，然后点击“B”，如果想使文字成为斜体，则点击“I”键。,项目4 美化网页文本,相关知识,二、编辑文本 修改字体样式： 如果想要设置文字对齐方式，则点击如图所示的按钮。,项目4 美化
10、网页文本,相关知识,二、编辑文本 修改字体大小和颜色： 用户输入文字的大小，一般是默认的大小，想将输入的字体放大，选中需要放大的字体，点击图中“无”后的“”，选择“24”，即可将字体设置为24号字，注意选择后面的单位为“px”（像素）。,项目4 美化网页文本,相关知识,二、编辑文本 修改字体大小和颜色： 想要改变字体颜色，需要先选中字体，然后点击如图所示的下拉按钮，即可弹出色板，在色板中选择自己喜欢的颜色即可。,项目4 美化网页文本,相关知识,二、编辑文本 设置段落格式： 文本的段落有标题、换行和已编排格式三种，标题：一共有六级，按照数字1-6排列，越小的数字，显示的段落就越明显、字体就越大。,项目4 美化网页文本,相关知识,二、编辑文本 使用列表： 在编辑文字的时候，为了方便用户直观的了解到内容的主题，通常采用列表的形式来进行文字的排版，在编辑文档的时候，读者可以根据实际的情况来决定是用“项目列表”还是“编号列表”。,项目4 美化网页文本,
