当前位置：文档之家 › 网页设计与制作第五章

网页设计与制作第五章

  • 格式：ppt
  • 大小：81.00 KB
  • 文档页数：16

下载文档原格式

  / 16

合集下载

网页设计与制作第5章

网页设计与制作第5章

5.4 框架
5.4.6 框架内容的控制
在框架页面中，各框架的内容是相互联系的，如果想要实现在某个框架内 单击文字连接后，在另一个框架中打开文档的效果，就必须设置链接目标。
5.5 表单
5.5.1 表单概述
一般来说，表单中包含文本字段、密码字段、单选按钮、复选框、弹 出菜单、可单击的按钮和其它表单对象。当访问者在浏览器中的表单内输 入信息并单击提交按钮时，这些信息会被发送到服务器，服务器中的服务 器端脚本或应用程序会对这些信息进行处理，以此进行响应。
5.1 表格的基本操作
5.1.2 向表格添加内容
1．添加文本内容 2．添加图像内容 3．嵌套内容
5.1 表格的基本操作
5.1.3 选择表格元素
1．选择整个表格 2．选择单元格 3．选择整行或整列
5.1 表格的基本操作
5.1.4 拆分、合并与复制、粘贴
1．拆分
2．合并
3．复制、粘贴单元格
5.1 表格的基本操作
5.5 表单
5.5.2 创建表单域
5.5.3 插入表单对象 1．插入文本字段
5.5 表单
2．插入复选框
3．插入单选按钮
5.5 表单
4．插入一组复选框或一组单选按钮
5．插入列表或菜单
5.5 表单
6．插入文件域
7．插入跳转菜单
5.5 表单
8．插入按钮
9．插入字段集
5.6 案例：框架网页
5.7 实训：宇泽-四合院
5.3 表格数据与表格排序
5.3.1 数据的导入导出
1．Excel数据导入 2．表格式数据导入 3．数据的导出
5.3 表格数据与表格排序
5.3.2 数据的排序
排序按：用于指定用哪一列的值对表格的行进行 排序。 顺序：用于设置是按字母还是按数字顺序以及是 以升序，还是以降序对列进行排序。 再按：用于设置在另一列上应用的第二种排序方 法的排序顺序。 排序包含第一行：用于设置第一行是否包含在排 序中，如果第一行是标题，则不勾选此项。 排序标题行：用相同的条件对表格的thead部分 （如果存在）中的所有行进行排序。 排序脚注行：用相同的条件对表格的tfoot部分 （如果存在）中的所有行进行排序。 完成排序后所有行颜色保持不变：指定排序之后 表格行属性（如颜色）应该与同一内容保持关联。

网页设计与制作案例教程(HTML5+CSS3)第5章使用CSS设置图像样式

网页设计与制作案例教程(HTML5+CSS3)第5章使用CSS设置图像样式

规定颜色值为 rgb 代码的背景颜色（比如 rgb(255,0,0)）。
默认。背景颜色为透明。 规定应该从父元素继承 background-color 属性的设置。
WEB
32
5.4 知识库：CSS背景样式
5.4.2 背景图像样式
第5章 使用CSS 设置图像样式
5.1 基础项目1：制作“李彦宏——众里寻他千百 度”网页 5.2 知识库：CSS图像样式
目录
5.3 基础项目2：制作“少年中国说”网页 5.4 知识库：CSS背景样式 5.5 提高项目：制作“低碳生活 从我做起”网页 5.6 拓展项目：制作“春节民俗”网页
WEB
2
background-color属性可用于设置图像或其它网页元素的背景颜色。其可 能的属性值如下：
属性值
color_name hex_number
描述
规定颜色值为颜色名称的背景颜色（比如 red）。 规定颜色值为十六进制值的背景颜色（比如 #ff0000）。
rgb_number
transparent inherit
name属性或id属性相关联，创建图像与映射之间的联系。具体
是name属性还是id属性由浏览器决定，所以应同时向<map>标 签添加name和id两个属性。
5.2.3 图像映射
<area>标签永远嵌套在<map>标签内部。<area>标签 定义图像映射中的区域，其属性及属性值如下：
必需的属性 属性 alt 属性 coords href nohref shape 值 text 描述 定义此区域的替换文本。
效果
5.2.2 CSS常用图像样式
提示： 当vertical-align的值为bottom或者sub时，IE与Firefox 的显示结果是不一样的，它们无所谓谁对谁错。在工作中，建 议尽量少地使用浏览器间显示效果不一样的属性值。

网页设计与制作05

网页设计与制作05

5.4 位图的处理
位图图形由排列成网格的称为“像素”的点组成。 5.4.1 区域的选择 1. 规则编辑区域的选择
单击工具箱中的“选取框工具”或“椭圆形选取框工 具”，在画布中按住鼠标左键并拖动，即可在位图中选 取一个矩形或椭圆形区域。
单击工具箱中的“套索工具”，在画布中按住鼠标左 键直接勾画可以在位图中画出一个不规则的闭合区域。 3.相近颜色编辑区域的选择
④选中组合的矢量对象，在“编辑”菜单选择 “粘贴于内部”，即可完成蒙版的效果，拖拽图 像中心蓝色调节柄可进行位图位置的调整。
5-5 创建动画
操作实例5-14 使用“以动画打开”方式创建动画 操作步骤：
①首先，制作好动画的每一帧图像，各自保存成一个文件， 如图5-54所示。 ②选择“文件”菜单的“打开”选项，在弹出的对话框中 选中这4幅图像文件，并选中“以动画打开”选项，如图 5-55所示，然后，单击“打开”按钮。 ③打开“帧面板”，即可看到组成动画的4帧，如图5-56 所示，此时单击图像窗口下方的“播放”按钮，可观看 动画的播放效果。 ④双击“帧面板”每帧后的数字“7”，可调整每一帧图 像播放的延时时间，以达到期望的播放效果，如图5-57
5.5.3 弹出菜单
弹出菜单是指当鼠标单击或滑过网页中的某些热点或 切片时，在浏览器中弹出的一个菜单。
操作实例5-22 为图5-75所示的网页创建弹出菜单 操作步骤：
①首先使用Web工具箱的“切片”工具为每个导航按钮勾 画一个矩形区域，如图5-76所示。下面以“实景案例” 栏目为例制作。
②单击“实景案例”切片，在“修改”菜单选择“弹出菜 单”、“添加弹出菜单”选项，或者单击切片中心的时 钟图形，在弹出菜单中选择“添加弹出菜单”，打开如 图5-77所示的“弹出菜单编辑器”，利用其中的4个选 项卡完成整个菜单的创建。

《网页设计与制作》电子教案课程课件PPT 第五章

《网页设计与制作》电子教案课程课件PPT 第五章
第5章 HTML语言和动态交互
HTML语言含有大量的标记符号， 并且还在不断的增加当中。本节 将介绍HTML一些常用的标记符号， 以及它们使用时的语法规则
5.1.1 网页和HTML语言的关系



在Dreamweaver的可视化窗口中制作网页时， 形成的目标文件仍然是HTML代码，如果切换 到代码窗口中，马上就可以看到对应的HTML 代码。 1．一个空白网页的HTML代码 当新建一个网页时，网页上没有什么对象， 这就是一个空白页，现在看一下空白页的 HTML代码。如图5-1所示。


在HTML语言中规定，两个 <Body>之间是输入网页对象 的位置。那么，如果是一幅 图像，情况又会怎样呢？ 注意：在代码窗口调试 HTML代码时，如果有语法 或格式错误，代码将会用黄 色显示。
图5-5代码窗口中的文本对照


3．在网页中插入图像 在网页中输入一行文本，采用5号字，再插入一幅大小为 150×100像素的图像，在两个窗口中观察对比一下。如图5的语法规则



1．HTML语言文件的基本结构 对于一个网页，即一个HTML文档，其基本结构为： <html> <head> 文档标题部分 </head> <body> 页面主体部分 </body> </html> · 从上面的格式可以看出，文档内容以<标记符>开始，以</标记符>结束。 · <head>文档标题</head> 是文件标题标记。 · <body>文档标题部分</body> 是页面主体部分标记。 · <html> </html>是一个页面的开始和结尾。

Dreamweaver CS5网页设计与制作教程第五章

Dreamweaver CS5网页设计与制作教程第五章

5.1 认识行为
行为是由对象、动作和事件构成的，事件是产生行为的条件，动作是行为 的具体结果。 对象：是产生行为的主体。对象可以是网页中的很多元素，如网页中的一 段文字、一幅图片等元素，也可以整个网页文档。 动作：通常是一段JavaScript代码，用于完成某些特殊的任务。如打开一 个窗口自动弹出“欢迎”窗口、鼠标经过图片图片晃动等效果。 事件：是由用户或浏览器引发动作产生的事情。事件经常是针对页面元素 的，也就是行为的对象，如鼠标经过、鼠标离开、鼠标单击等。
5.2 使用行为
文本域文字的行为 页面中的用户登录需要输入用户名、密码，因此在页面会插入给用户输入的 文本域。常常可以设计这样的效果：当鼠标移到文本域时，文本域中显示“ 请输入用户名”，当文本域获得焦点时，之前的文字消失，用户则可以输入 用户名信息。这种效果是添加了文本域文字的行为
5.2 使用行为
制作交换图像 “交换图像”这一动作的特效是恢复交换的图像。当鼠标经过图像时，原图 像会变成另外一幅图像，否则恢复原图像。其实，一个交换图像是由两幅图 像组成的，包括原始图像和鼠标经过时显示的交换图像。
5.2 使用行为
制作交换图像 2.选择行为的事件。
<img src="images2/cp2.jpg" alt="" name="Image1" width="256" height="226" hspace="10" vspace="10" id="Image1" onmouseover="MM_swapImage('product', '','images2/cp2.jpg',1)" onmouseout="MM_swapImgRestore()" />

网页设计与制作第5章

网页设计与制作第5章

网页设计与制作
第5章 创建网页对象
图5.2.3 插入的占位图像
在发布站点之前，应该使用普通图像替换所有的占位图 像，方法如下： （1）双击占位图像。 （2）在弹出的“选择图像源文件”对话框中选择要替换 占位图像的普通图像。 （3）单击“确定”按钮，即可将占位图像替换掉，如图 5.2.4所示。
网页设计与制作
网页设计与制作
第5章 创建网页对象
5.2.1 图像的插入 根据图像在网页中作用的不同，可以将其分为普通图像、占 位图像和鼠标经过图像3种，下面分别介绍它们的插入方法。 1．插入普通图像 插入普通图像的方法如下： （1）将鼠标指针置于需要插入图像的位置。 （2）选择“插入”→“图像”命令，弹出 “选择图像源 文件”对话框，如图5.2.1所示，在该对话框中选择合适的图像， 单击“确定”按钮即可。
图5.1.7 不同样式下的文本
网页设计与制作
第5章 创建网页对象
4．设置文本的大小 文本的大小即文本的字号，在Dreamweaver 8中，字号用 数字来表示，值越大，所对应的文本就越大。设置文本大小的 操作步骤如下： （1）选中要设置大小的文本。 （2）在“属性”面板的“大小”下拉列表中选择所需的 字号即可。如图5.1.8所示为不同字号下的文本。
2．插入占位图像 占位图像实际上是一种图像占位符，在实际制作网页的 过程中，当网页的整体排版已经完成，但是需要插入的图像 还没有制作出来时，可以插入一个占位图像，来配合排版的 需要，等到图像制作出来后，再将占位的图像替换掉。插入 占位图像的方法如下： （1）将鼠标指针置于需要插入占位图像的位置。 （2）选择“插入”→“图像对象”→“图像占位符”命 令，弹出“图像占位符”对话框，如图5.2.2所示。
网页设计与制作

网页设计与制作-自考-第五章HTML历年考题整理

网页设计与制作-自考-第五章HTML历年考题整理第五章HTML语言历年考题一、单选题1.在HTML语言中，标记</body>代表（）A.文件头开始B.文件头结束C.文件体开始D.文件体结束2.在HTML语言中，符号<pre>表示（）A.预排版标记B.文字效果标记C.特殊符号标记D.转行标记3.在HTML文件中，使一段文字按照原来的格式显示的标记是( )A.<form>B.<tr>C.<nobr>D.<pre>4.在HTML文件中，<u><／u>标记表示( )A.文本加粗B.文本加注底线C.文本斜体D.删除线5.在HTML语言中，<sup>代表( )A.倾斜标记B.文字闪烁标记C.下标标记D.上标标记6．在HTML语言中转行的标记是 ( )A．<p> B．<br> C．<title> D．<pre> 7．在HTML中，关于文字效果标记的说法错误的是( )A．可以使用font标记color属性指定文字颜色B．可以使用font标记size属性指定文字大小C．可以使用em标记指定文字的斜体效果D．可以使用cite标记指定粗体字体8.在HTML页面中，&amp；表示的符号是( )A.<B.>C.&D.’’9．在HTML语言中，有些符号由于被标记或标记的属性所占用，在HTML文本中用特殊符号表示，“&LT；”代表的符号是()A．& B．" C．> D．<10.在HTML标记中，关于<hx>的描述正确的是（）A.<hx>表示横线标记B.<hx>中的x表示1～6的数字标题字体标记有6种C.<hx>本身是一个独立的标记，表示新的行的开始D.<hx>必须与<／.hx>标记一起使用11.在HTML中，关于预排版标记<pre>…<／pre>叙述正确的是（）A.不需要重新排版的内容，可以用<pre>…<／pre>标记通知浏览器B.使用该标记时与<p>标记效果相同C.使用该标记与<quot>标记效果相同D.该标记已不在新版本中使用，取代它的是<quot>标记12.在HTML标记中，&AMP表示的符号是（）A.<B.>C.＆D.@13.在HTML中，关于<br>的描述不正确．．．的是（）A. <br>是转行标记 B. <br>必须与</br>成对使用C. 与<br>相反的标记是<nobr> D. <br>与</br>之间的文字即使有回车符也不能自动换行14.下列标记中，字体最小的是( )A.〈H1〉B.〈H3〉C.〈H5〉D.〈H6〉15.不能．．使文字换行的标记是( )A.〈PRE〉B.〈BR〉C.〈P〉D.〈BLOCK〉16.对文字使用下划线的标记是( )A.〈X〉B.〈P〉C.〈U〉D.〈B〉17.上标标记是( )A.〈SUP〉B.〈SUB〉C.〈STRIKE〉D.〈BLINK〉18.BACKGROUND属性指定的是( )A.背景色B.背景音乐C.背景图片D.背景有无19.&GT表示的符号是( )A.<B.>C."D.&20.&AMP表示的符号是( )A.<B.>C."D.&21.在HTML标记中，&QUOT表示的符号是（）A. QUOTB. &C. ＂D. < 22．下列标记不能．．改变文字颜色的是（）A．<FONT COLOR=RED> B．<FONT COLOR="RED">C．<FONT COLOR=#FF0000> D．<FONT COLOR=#12>23．&LT表示的符号是（）A．< B．> C．″D．&24．下列不是．．文字斜体标记的是（）A．<em> B．(embed) C．(i> D．(cite) 25．对文字使用删除线的标记是（）A．(d) B．(delete) C．(del) D．(strike)26.在HTML语言中，嵌入图片的标记是（）A.<caption>……</caption>B.<img src=¨URL¨>C.<embed src="URL">D.<a href="URL">字符串</a>27.在HTML中，符号清单的type属性值square表示( )A.实心圆点B.空心圆点C.实心方块D.空心方块28.在HTML文件中，单击一个链接，自动跳转到某网页的某一指定位置，此链接为( )A.邮件链接B.位置链接C.跳转链接D.书签链接29.下列标记属于单选按钮的是( )A.<input type="text">B.<input type="radio">C.<input type="button">D.<inputtype="checkbox">30.在表格标记中，cellpadding属性的作用是( )A.数据与表边框的距离B.表格边框的高度C.表格的扩展边距D.表格边框的宽度31.在HTML文件中，可以设置声音文件始终循环播放的是( )A.loop=″true″B. loopdelay=″true″C. loop=″no″D. loopdelay=″no″32.在HTML中，要定义一个书签应该使用的标记是( )A.<a target=″#object-name″>text<／a>B.<alink=″#object-name″>text<／a>C.<a name=″object-name″>text<／a>D.<a href=″#object-name″>text<／a>33.在HTML中，文本域的标记是( )A.<text…>B.<input type=text…>C.<input type=textarea…>D.<textarea…>34.在HTML中插入图片标记，对插入的图片进行文字说明，使用的属性是( )A.hspaceB.alignC.altD.src35．在HTML中，对于表格的标记，若单元格在水平方向上跨多个单元格，需使用的属性是 ( )A．valign B．colspan C．nowrapD．rowspan36．在HTML页面中插入图片时，关于图像边框属性的说法错误的是 ( )A．图像和文字之间的距离是可以调整的B．可以用vspace属性调整图像和文字之间的上下距离C．默认值为1D．单位为像素37．在HTML中，属于复选框标记的是 ( )A．<input type="text"> B．<input type="checkbox">C．<input type="password"> D．<input type="radio">38．符号清单包括()A．选项清单和说明式清单B．标号清单和说明式清单C．选项清单和标号清单D．标号清单和嵌套清单39．在HTML中，指定Wav声音文件在网页中播放次数的是()A．loop属性B．loopdelay属性C．start属性D．src属性40．在HTML中使用图像地图时，设置图像区域的形状为多边形的是()A．triangle B．rect C．poly D．circle 41．下列可以指定横向框架的是()A．<frame cols="20％，*"> B．<frameset cols="20％，*">C．<rows="20％，*"> D．<frameset rows="20％，*">42.关于HTML文档的描述正确的是（）A.HTML文档不是ASCII文件B.HTML语法虽然简单，但也不能脱离如FrontPage、DreamWeaver等其它工具C.在学习HTML之前，首先要掌握一门编程语言D.创建一个HTML文档，所需的最基本标记是<html>和<／html>43.在HTML中，定义表格标题行的标记是( )A.<caption>B.<th>C.<td>D.<tr>44.在HTML中，表格合并水平单元格的标记是（）A.<td align=列>B.<td align=行>C.<td colspan=3>D.<td rowspan=3>46.在HTML中，图片的超级链接<area>标记不包．．含．的属性是（）A.shapeB.img C．coords D.href47.关于HTML文档的描述正确的是（）A. <HTML>和</HTML>是最基本的两个标记B. 浏览器能够看到HTML文档的内容，主要原因是HTML文档是可执行的文档C. HTML文档可以是一门开发语言，可以编译成机器语言D. HTML文档是ASCII文件，无其它特殊功能48.在HTML中，说明表格行的标记是（）A. <caption>B. <tr>C. <th>D. <td>49.<input type =hidden name=mail value =＂liming@＂>的作用是（）A. 暂时不执行该域B. 隐藏该域名称，供需要时使用C. 在页面上不会显示这个元素，但是当发送信息时可以把名为mail的值传递给处理程序D. 隐藏电子邮件，以防被浏览者使用50.在HTML中，合并表格垂直单元格使用的标记是（）A. <td align=列>B. <td align=行>C. <td colspan=3>D. <td rowspan=3>51.在HTML中，要想输入多行文本，应使用的标记是（）A. <input type=text…>B. <input type=textarea…>C. <text…>D. <textarea…>52.在HTML中，关于图片链接<area>标记中，shape 属性的值不包含．．．（）A. triangleB. rectC. circleD. poly53.标号清单的数字形式属性中，TYPE=#格式中，不．包含．．的格式是( )A.1,2,3…B.A,B,C…C.i,ii,iii…D.甲,乙,丙…54.设置表格格内垂直对齐的HTML标记是( )A.〈td valign=?〉B.〈td colspan=#〉C.〈td rowspan=#〉D.〈td nowrap〉55.〈img src="name"align="left"〉意思是( )A.图像向左对齐B.图像向右对齐C.图像与底部对齐D.图像与顶部对齐56.创建一个滚动菜单的HTML代码是( )A.〈form〉〈/form〉B.〈select multiple name="NAME" size=?〉〈/select〉C.〈option〉D.〈select name="NAME"〉〈/select〉57.框架中“边缘宽度”的标记是( )A.〈img src="url" border=?〉B.〈frame marginheight=?〉C.〈frame marginwidth=?〉D.〈textarea wrap=off｜virtual｜physical〉〈/textarea〉58．不能．．使用CENTER属性的标记是（）A．<BODY> B．<TITLE> C．<P> D．<H3>5．<SUB>的标记是（）A．子串标记B．居中标记C．下标标记D．上标标记59．清单前的符号可由最外层加TYPE属性来控制，不属于．．．符号清单的标记属性是（）A．DISC B．CIRCLE C．TRIANGLED．SQUARE60．<CAPTION>标记设置的是表格的（）A．标题B．列标题C．带表框的表格D．居中且加粗的表格61．不属于．．．TD标记属性的是（）A．WIDTH B．ALIGN C．BACKCOLORD．NOWARP62．<TD COLSPAN=3>设置的是表格的（）A．宽度B．高度C．合并水平格D．边框63．在WEB页中插入图片使用的标记是（）A．<SRC> B．<IMG> C．<BGGROUND> D．<URL>64．下列标记不正确．．．的是（）A．<a href=″test1.htm″>test</a>B．<a href=″test1.htm#Nokia8850″>Nokia 8850</a> C．<a name=″test.htm″>test</a>D．<a href=″#test.htm″>test</a>65．在菜单标记中，默认选中的标记是下列哪一项？（）A．<img src=″url″border=?>B．<option selected>C．<isindex prompt=″* * *″>D．<textarea wrap=ff | virtual | physical >< /textarea > 66．下列特殊符号的HTML表示法正确的是（） A．B．C．D．67．超级链接应该使用的标记是（）A．(title) B．(body) C．(a) D．(head) 68．下列标记可以不成对出现的是（）A．(html)(／html) B．(p)(／p) C．(title)<／title) D．(body)(／body)69．不能．．在网页中嵌入的声音文件是（）A．后缀为．wav的文件 B．后缀为．mid的文件C．后缀为．au的文件 D．后缀为．md的文件70．设置背景音乐除了使用bgsound标记外，还可以使用的标记是（）A．<sound> B．<bgground) C．<embed) D．<gbmusic>71．<a name=“second”>text<／a>的作用是（）A．设置超级链接，链接到second页面上B．设置—个书签为second的标记C．设置—个链接，指向second文件D．设置第二个链接72．单图单向超级链接的格式是（）A．<a href=“URL”><img=“URL”>(／a)B．<a href=“URL”><URL=“URL”>(／a>C．<img src=“URL”>D．<img=“URL”>73．对于标记(input type=*)，其中t位置放上一个值，表示输入时显示*号。

网页设计与制作Dreamweaver CS6标准教程(微课版 第3版)第五章

网页设计与制作Dreamweaver CS6标准教程（微课版第3版）第五章该节介绍了网页设计的基本原则，包括布局、色彩、字体、图片等方面的要点。

该节详细介绍了如何使用Dreamweaver CS6创建网页，包括新建网页、添加文本、插入图片等操作步骤。

该节讲解了如何使用CSS样式来美化网页，包括设置背景色、文本样式、边框效果等。

该节教授了如何创建超链接，包括内部链接和外部链接的创建方法。

该节介绍了如何使用Dreamweaver CS6中的模板和库来快速创建和管理网页。

模板是预先设计好的网页样式和布局，可以用于多个网页。

通过使用模板，您可以避免重复性的工作，节省时间和精力。

在Dreamweaver CS6中，您可以选择现有的模板，也可以自定义创建自己的模板。

本节将向您展示如何使用这些模板。

库是一组可以在不同网页中重复使用的元素或代码片段。

通过使用库，您可以轻松地在多个网页中保持一致的元素和代码。

本节将向您介绍如何创建并使用库。

___:了解如何使用Dreamweaver CS6中的模板创建网页学会创建自定义模板掌握如何使用库在网页中重复使用元素和代码学会创建和管理库5.1 使用模板创建网页Dreamweaver CS6提供了一系列模板供您选择，包括网站模板和文档类型模板。

您可以根据自己的需求选择适合的模板，并进行自定义设置，如网页标题、导航菜单、页脚等。

本节将向您展示如何使用Dreamweaver CS6中的模板创建网页。

5.1.1 选择现有模板Dreamweaver CS6中内置了许多现有的网站和文档类型模板供您使用。

您可以从模板库中选择适合您的模板，并进行进一步的定制。

本节将向您介绍如何选择并使用现有的模板。

5.1.2 创建自定义模板除了使用现有模板外，您还可以创建自己的模板。

自定义模板可以根据您的需求进行设计和设置，并在创建新网页时使用。

创建自定义模板的过程相对复杂一些，但是一旦创建完成，您可以多次重复使用它。

  1. 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
第5章 用Dreamweaver制作 动态网页
5.1 插入动画 5.2 创建和使用层叠样式表 5.3 加入各种JavaScript特效
5.1 插入动画
5.1.1插入Flash动画
1.插入Flash动画的基本方法 将光标放置在表格任意单元格中，单击常用快捷工具栏
中的“媒体”按钮，然后在弹出的列表中选择Flash命令。 2.插入Flash实例
上一页 下一页 返回
5.3 加入各种JavaScript特效
5.3.5表单的合法性检查
(1)字符串长度限制、判断字符长度、js限制输入、限制不能输 入、textarea长度限制；
(2)判断汉字、判断是否汉字、只能输入汉字； (3)判断是否输入英文、只能输入英文； (4)只能输入数字，判断数字、验证数字、检测数字、判断是否
上一页 下一页 返回
5.2 创建和使用层叠样式表
3.设置导航条文本的格式
(1)为导航创建新规则 打开cafe townsend.css文件，或打开其选项卡来显
示该文件。定义一个新规则，方法是在该文件的.bold类样 式后面输入以下代码：.navigation{} (2)应用规则
上一页 下一页 返回
5.2 创建和使用层叠样式表
5.2.3创建HTML元素样式表
1.外部样式表 当样式需要被应用到很多页面的时候，外部样式表将是
理想的选择。使用外部样式表，就可以通过更改一个文件来 改变整个站点的外观。 2.内部样式表
当单个文件需要特别样式时，就可以使用内部样式表。 可以在head部分通过<style标签定义内部样式表。 3.内联样式
5.2 S规则 使用"css样式”面板创建自定义的css规则或类样式。
类样式使用户可以设置任何范围或文本块的样式属性，并可 以应用到任何HTML标签。
上一页 下一页 返回
5.2 创建和使用层叠样式表
2.将类样式应用到文本
现在，己经创建了一个类规则，并将该规则应用到某些 段落文本。在“文档”窗口中，选择第一段中文本的前4个 单词：Cafe Townsend‘s visionary chef。在“属性” 检查器(选择“窗口” →“属性”命令)中，从“样式”下拉 列表框中选择bold选项。
5.2.1使用层叠样式表面板
“css样式”面板可让用户跟踪影响当前所选页面元素的 css规则和属性，或影响整个文档的规则和属性，还可以在 不打开外部样式表的情况下修改css属性。在“css样式”面 板(选择“窗口” →“css样式”命令)中，单击面板顶部的 “所有”按钮，然后检查css规则。
下一页 返回
为数字、只能输入数字； (5)只能输入英文字符和数字； (6)E-mail验证、js判断E-mail、信箱/邮箱格式验证； (7)字符过滤、屏蔽关键字； (8)密码验证、判断密码；
上一页 下一页 返回
5.3 加入各种JavaScript特效
(9)不为空、为空或不是对象、判断为空、判断不为空； (10)比较两个表单项的值是否相同； (11)表单只能为数字和“”； (12)表单项输入数值/长度限定； (13)中文/英文/数字/邮件地址合法性判断； (14)限定表单项不能输入的字符； (15)表单的自符控制； (16)form文本域的通用校验函数。
上一页 下一页 返回
5.2 创建和使用层叠样式表
5.2.5链接外部样式表
CSS样式表是一个包含样式和格式规范的外部文本文件。 编辑外部CSS样式表时，链接到该CSS样式表的所有文档全 部更新以反映所做的更改。可以导出文档中包含的CSS样式 以创建新的CSS样式表，然后附加或链接到外部样式表以应 用那里所包含的样式。
下一页 返回
5.3 加入各种JavaScript特效
5.3.2加人声音特效
使用“播放声音”动作来播放声音。例如，用户可能要 在每次鼠标指针滑过某个链接时播放一段声音效果，或在页 载入时播放音乐剪辑，或者单击某个按钮播放声音，等等。
上一页 下一页 返回
5.3 加入各种JavaScript特效
5.3.3自动弹出广告窗口
当特殊的样式需要应用到个别元素时，就可以使用内联 样式。使用内联样式的方法是在相关的标签中使用样式属性。 样式属性可以包含任何CSS属性。以下实例显示出如何改变 段落的颜色和左外边距。
上一页 下一页 返回
5.2 创建和使用层叠样式表
5.2.4创建动态的文字超链接
超链接在本质上属于一个网页的一部分，它是一种允许 我们同其他网页或站点之间进行连接的元素。各个网页链接 在一起后，才能真正构成一个网站。所谓的超链接是指从一 个网页指向一个目标的连接关系，这个目标可以是另一个网 页，也可以是相同网页上的不同位置，还可以是一个图片， 一个电子邮件地址，一个文件，甚至是一个应用程序。而在 一个网页中用来超链接的对象，可以是一段文本或者是一个 图片。当浏览者单击己经链接的文字或图片后，链接目标将 显示在浏览器上，并且根据目标的类型来打开或运行。
5.3 加入各种JavaScript特效
5.3.4创建动态图片
在网站开发的过程中，有时击要制作图片集的网页，如 果能给每张图片再配以文字说明，那就是锦上添花了。但是 若一幅图片下面配一段文字说明，那么页面一定显得很兀长。 若是能使所有图片说明在一个地方显小，目随着鼠标在图片 间移动，说明的文字也动态地随之更换，那么页面就简洁多 了。Behaviors的Set Text of Layer动作可以帮我们实 现这种动态效果。
上一页 返回
下一页 返回
5.1 插入动画
5.1.2用时间轴创建层动画
(1)新建网页文件 (2)插入层对象 (3)插入文本内容 (4)打开时间车由浮动面板 (5)添加动画对象。 (6)调整动画长度 (7)设置动画起点 (8)添加关键帧、设置关键帧位置 (9)设置播放方式 (10)预览动画效果
上一页 返回
5.2 创建和使用层叠样式表
1.弹出信息窗口 启动Dreamweaver MX 2004，打开要加载弹出窗
口的网页或新建一个网页。按Shift+F3织合键，打开“行 为”面板。 2.弹出网页窗口
弹出网页窗口的制作过程与信息窗口有点相似，首先须 准备好浏览当前网页时要打开的网页，然后选择“打开浏览 器窗口”命令。
上一页 下一页 返回
上一页 返回
5.3 加入各种JavaScript特效
5.3.1使用行为面板
(1)单击对象面板，插入一个按钮 (2)选择所插入的按钮，在属性面板中修改按钮的标题 (3)选择所插入的按钮，打开“行为”面板，在“添加行为”菜
单中选择“Popup Message"命令。 (4)在“弹出信息”对话框中输入所要显小的信息 (5)单击OK按钮，所指定的行为己经添加到按钮对象上