2网页基本元素.pptx

网页制作技术网页基本元素

教学目标掌握文本的编辑与格式设置掌握在网页中插入及编辑图像的方法掌握插入常见多媒体对象的方法掌握并灵活应用超链接

文本与文档2.1.1在网页中输入文本输入文本是Dreamweaver中最基本的操作之一。用户在文档中既可以输入普通文本，也可以插入日期和特殊字符。另外，用户还可以通过复制和粘贴HTML元嗲吗的方式输入文本。1.输入普通文本（1）直接输入文本：讲光标定位在需要输入文本的位置，即可直接输入文本。（2）从其他文档中复制文本：在其他文档中选中要复制的文本，按Ctrl+C快捷键将其复制到剪贴板中，讲光标定位到网页中需要输入文本的位置，按Ctrl+V快捷键粘贴文本即可。

文本与文档2.插入特殊字符制作网页时，有时需要输入一些键盘上没有的特殊字符，这就需要使用Dreamweaver的特殊字符添加功能。具体操作步骤是：（1）将光标定位在需要输入特殊字符的位置。（2）选择“插入”→“HTML”→“特殊字符”命令，在子菜单中选择合适的字符命令。（3）如果在该子菜单中没有找到需要的字符，则可以选择“其他字符…”命令，打开“插入其他字符”对话框，其中有更多的特殊字符可供选择。3.输入空格在Dreamweaver中添加空格时，无论按多少次空格键都只会出现一个空格。当文档中需要输入连续多个空格时，可以用下列方法：（1）单击Dreamweaver的“文本”插入栏的“已排版格式”按钮，然后再连续按空格键。

文本与文档（2）连续多次按Ctrl+Shift+空格键。（3）在Dreamweaver中选择“编辑”→“首选参数”命令，打开“首选参数”对话框，如图2-3所示，将“常规”分类中的“编辑选项”中“允许多个连续空格”复选框勾选。2.1.2设置文本格式在Dreamweaver中，可以使用文本的“属性”面板对文本进行格式化，使其更加调理清晰、主次分明。1.文本对齐要对齐段落文本，先选中文本，在“属性”面板中单击，并在“格式”选项中选中“段落”，然后“属性”面板上顺序单击和“编辑规则”按钮，或者在“CSS”面板下端单击，都可以打开“新建CSS规则”对话框，在对话框“选择器类型”下拉列表框中选中“标签（重新定义HTML元素）”并单击“确定”按钮，打开“P的CSS规则定义”对话框，单击“区块”分类的“Text-align(T)”右下角的小三角，即可设置适当的段落对齐方式。

文本与文档2.文本的字体、字号、颜色等属性设置在对话框的“类型”分类中，“Font-family(F)”可以设置字体，“Font-fize(S)”可以设置字号，“Color(C)”可以设置字体颜色，除此之外，还可以设置字体加粗、字型、行高，英文大小写等其他属性。2.1.3创建列表列表术语文本的段落格式，有项目列表和编号列表两种。1.项目列表项目列表也称为无序列表，这种列表的项目之间没有先后顺序。项目列表前一般用项目符号作为前导字符。创建项目列表的操作步骤如下：（1）将光标定位到要创建项目列表的位置。（2）单击“属性”面板上的“项目列表”按钮，或者单击“插入”工具栏“文本”选项的“项目列表”按钮，或者单击菜单栏“插入”→“HTML”→“文本对象”→“项目列表”命令，都将出现项目列表前导符号。

文本与文档（3）在前导符号后输入项目文本，按回车键结束本列表项目。（4）全部输完后按两次回车键即可结束。2.编号列表编号列表又称有序表，其文本钱同城有数字前导字符。创建项目列表的操作步骤如下：（1）将光标定位到要创建编号列表的位置。（2）单击“属性”面板上的“编号列表”按钮，或者单击“插入”工具栏“文本”选项的“项目列表”按钮，或者单击菜单栏“插入”→“HTML”→“文本对象”→“编号列表”命令，都将出现编号列表数字前导符号。（3）在数字后输入文本，按回车键结束本项目。（4）全部输完后按两次回车键即可结束。

图像与多媒体2.2.1在网页中使用图像图像和文字是网页中最重要的两种元素。图像是文本的说明和解释，如果在网页的适当位置放置一些图像，不仅可以使文本清晰易读，而且可以使网页更加具有吸引力。网站中的图像最好存放在单独的文件夹中，文件夹通常命名为images。1．图像格式目前，Internet上最常见的图像格式包括JPEG、GIF和PNG。JPEG和GIF两种格式获得了各种浏览器的支持，具有很好的跨平台传送能力，PNG图像格式，正在被越来越多的浏览器所支持。

图像与多媒体2.插入图像通常在向网页中插入图像之前，先画表格为插入的图像预留空间，再用图像处理软件将图像处理成预定尺寸，然后才进行插入图像操作。在网页中插入图像的具体操作步骤如下：（1）将光标定位到网页上需插入图像的表格单元格位置。（2）在“插入”面板的“常用”选项卡中单击图像按钮，或者执行菜单栏中