《第3章网页的编辑.ppt》由会员分享，可在线阅读，更多相关《第3章网页的编辑.ppt（14页珍藏版）》请在三一文库上搜索。
1、3.1 字体与段落的设置,在网页上浏览时，可以发现：任何一个网页，不论优秀，还是平庸，都含有两个要素，即文字和图片。其中文字是一个网页最基本的要素， 掌握文字字体与段落的设置方法 ，非常重要。,3.1.1 字体与字号-行间距,用键盘操作换行有两种方法：按Enter键或按Enter+Shift组合键。按Enter键，换行的行距较大。一般换行使用Enter+Shift组合键，这样换行才是正常行距。,行间距：,使用Enter键的效果,使用Enter+Shift组合键的效果,3.1.1 字体与字号-添加字体,由于Dreamweaver提供的默认字体中没有中文字体，所以在设置字体之前，应该先将中文字体添
2、加到“属性面板” 字体下拉列表框中。,在“属性面板”中，单击“字体”框，在下拉菜单中选择“编辑字体列表” 。在弹出的对话框中，选中“可用字体”栏中的中文字体，单击“选定”按钮，字体出现在“选择的字体”栏中。单击“确定”，字体被加入。,3.1.1 字体与字号-设置字体和字号,选择文字，然后，在“属性面板”中单击“字体”框，在下拉列表中选择“楷体GB_2312”，将字体设为楷体；单击“字号”框，在下拉列表中选择“3”，将字体设为3号字。,文字字号的下拉选框有无、1、2、3、4、5、6、7、+1、+2、+3、+4、+5、+6、+7、-1、-2、-3、-4、-5、-6、-7等选项。无表示使用浏览器默认
3、字号（一般为3），单独的数字表示字号，数字前有“+“号和“-“号表示相对于默认字号的字号大小。例如，5表示5号字，+3表示默认字号大小加上3，-2表示默认字号大小减去2。,3.1.2 文字的对齐方式,选中整个表格，将属性面板中的“填充”值更改为10，这样各个单元格间的距离更改为10像素；将“间距”值更改为10，这样表格中的文字与表格框线的距离变成10像素。,选中单元格, 这时属性面板显示的是单元格设置的内容。单击“对齐”框在弹出的下拉菜单内中选择“居中对齐”，单元格中文字在单元格中居中显示。,3.1.3 文字的风格与颜色,选中文字，在属性面板中单击“颜色”按钮，打开颜色板，选择褐色，将文字设为
4、褐色。单击“加粗”，将文字设为加粗。,3.1.4 段首缩进,在文章的首行，要空两个格，在Dreamweaver中，不能象Word一样拖动首行缩进按钮，也不能连续按空格。要实现在段首空两个格，应该切换到代码编辑区，在段首文字前输入代码（注意不要漏掉；）。,单击“查看”菜单。在下拉菜单中选择“代码和设计”命令。,在HTML代码编辑区域中，找到要段落缩进的文字，在文字前插入 ；。然后在文本编辑区单击鼠标，可以看到实际效果。注意由于一个汉字占两个字节，所以默认情况下要插入4个标记。,3.2 美化网页,美化页面最简单直接的方法就是在网页上添加图片。除了文字，图片是网页中最重要的构成元素。有了图片
5、可以使网页内容更生动，同时可以表达一些文字不好表达的内容，使网页内容的表达更直观，更一目了然。,设置了背景色和背景图片，可以给网页穿上漂亮的外衣，使网页不再单调。人们说一个网页漂亮，通常就是指网页上的图片漂亮。,3.2.1 插入水平线,在网页中插入一条水平线，将网页底端的文字与正文分开。这样可以使网页段落分明。,将光标移动合适位置，单击插入面板的“水平线”按钮，网页上自动插入一条水平线。,当用鼠标选取水平线时，窗口下面的属性面板显示水平线的相关内容，在该面板中可以修改水平线的宽度和高度。,3.2.2 插入图片-图片格式,因特网上应用最广泛的图片格式有两种：GIF文件和JPEG文件。,3.2.2
6、 插入图片,确定光标的位置，单击对象面板上的 “图像”按钮，弹出“选择图像源”对话框， 单击查找范围，在下拉菜单中，选择位置，找到图片。单击“确认”，将图片插入网页。,由于图片在网站以外，所以，Dreamweaver弹出一个对话框，提示是否将图片保存到网站中。单击“是”。完成操作。,3.2.3 设置图片,单击图片，图片被一个黑框框住，同时出现三个小的实心黑框。鼠标指针指向实心黑框，当鼠标指针变成双向箭头时，拖动鼠标，更改图片的大小。,在单击图片时，属性面板同时被打开。在“替代”框中输入文字。这样，当鼠标在浏览器中移动到该图片上时，会显示替代文字；特别地，由于网络慢等原因，图片不能正常下载时，图片区域会显示替代文字，从而不会影响到网页的整体效果。,3.2.4 添加网页背景,要使网页漂亮起来，设置页面属性必不可少。用鼠标单击菜单栏上的“修改”，在下拉菜单中单击“页面属性”，打开“页面属性”对话框。,在“页面属性”对话框中，单击背景图像框右边的“浏览”，找到存放图像的文件夹，选中图片，单击“确定”，完成操作。,3.2.5 设置表格背景,拖动鼠标选中所有单元格，单击“属性”面板上背景颜色后面的“颜色”块，在弹出的调色板中选择一种颜色，单元格背景颜色被改变。,