电子商务网页设计与网站建设――第四章 构建动态HTML页面

第四章构建动态HTML页面构建动态HTML页面•4.1插入动画•4.2应用CSS•4.3给页面加入声音4.1插入动画•插入flash动画•插入flash按钮对象•插入JavaApplet插入flash动画•将光标放在插入flash动画的位置•执行“插入记录”中“媒体”“Flash”命令，在弹出的“选择文件”对话框中选择制作好的flash文件，点击确定•选中flash，在“属性”面板中进行设置插入flash按钮对象•在需要的位置插入一个6行1列的表格•将光标置于第1行单元格中，执行“插入记录”中“媒体”“Flash按钮”命令•在弹出的“插入Flash按钮”对话框中设置–范例–样式–按钮文本–字体–大小–链接–目标–背景色–另存为•点击“应用”预览按钮•点击“获取更多样式”可从网上获得更多的样式•选择一个样式，在“按钮文本”中输入文字，在“另存为”中输入按钮的文件名称•点击确定插入JavaApplet•Java是用于制作基于因特网的可执行应用程序的语言，常常应用于动画、网络游戏和聊天室•JavaApplet是可直接插入网页，具有动态和交互效果的Java小程序•将光标置于插入位置•执行“插入记录”中“媒体”的“Applet”命令，在弹出的对话框中选择.class文件，点击确定4.2应用CSS•4.2.1CSS简介•4.2.2在Dreamweaver中使用CSS样式表•4.2.3设置样式表属性•实例：利用CSS制作特效文字4.2.1CSS简介•CascadingStyleSheet（CSS）层叠样式表（或级联样式表）–用于定义文字属性、文本属性等网页中基本信息，是网页中的字体、大小、颜色等一系列基本信息，不随着浏览器及系统显示的分辨率等因素的变化而变化，使得网页具有一定“固定”性•CSS的基本语法–HTML标志{标志属性：属性值；标志属性：属性值；……}•例：将H1-H6各级标题定义为红色黑体字，带下划线–H1，H2，H3，H4，H5，H6{–Color:red;–Text-decoration:underline;–Font-family:“黑体”–}4.2.2在Dreamweaver中使用CSS样式表•使用“CSS样式”面板–附加样式表–新建CSS样式–编辑样式表–删除CSS样式•创建新的CSS样式–在“CSS样式”面板底部单击“新建CSS样式”按钮，在弹出的“新建CSS规则”对话框中设置•选择器类型：选择“标签”•标签：输入“td”•定义在：选择“新建样式表文件”–点击确定，保存新建的样式表，即可创建CSS样式表•应用自定义CSS样式–在“CSS样式”面板中的空白处单击鼠标右键，在弹出的菜单中选择“新建”选项，在弹出的“新建CSS规则”对话框中设置•选择器类型：类•名称：.wz•定义在：“新建样式表文件”，仅对该文档–点击确定，在弹出的“.wz的CSS规则定义”对话框中设置•选择“类型”标签•“字体”为宋体•“大小”为12px•“行高”为“2字体高”•“颜色”为#000000–点击确定，“CSS样式”面板中新建了一个样式表–选中套用样式的文字，在“CSS样式”面板中选中新建的样式，单击鼠标右键，在弹出的菜单中选择“套用”选项•创建和链接到外部CSS样式表–在“CSS样式”面板中单击鼠标右键，在菜单中选择“附加样式表”选项–在弹出的“链接外部样式表”对话框中设置•添加为：链接•单击“文件／ＵＲＬ”文本框右边的“浏览”，选择相应的样式表文件–点击确定4.2.3设置样式表属性•类型–字体–大小–样式–行高–修饰–粗细–变体–大小写–颜色•背景–背景颜色–背景图像–重复–附件–水平位置/垂直位置•区块–单词间距–字母间距–垂直对齐–文本对齐–文字缩进–空格–显示•方框–宽/高–浮动–清除–填充–边界•边框–样式–宽度–颜色•列表–类型–项目符号图像–位置•定位–类型–显示–Z轴–溢出–可见–隐藏–滚动–自动•扩展–分页–视觉效果实例：利用CSS制作特效文字•将光标置于页面中，执行“插入记录”中“表格”命令，插入一个1行1列的单元格，“表格宽度”为50%，居中对齐•将光标置于单元格内，输入文字•在“CSS样式”面板中新建一个样式表–选择器类型：类–名称：.unnamed1–定义在：仅对该文档•点击确定，设置“类型”–字体：楷体_GB2312–大小：50px–颜色：#FFFFFF•设置“扩展”–过滤器：Glow(Color=?,Strength=?)•点击确定，套用样式表4.3给页面加入声音•常见的声音文件–.mid–.wav–.aif–.mp3–.ra，.ram，.rpm•在Web页中添加声音的方法–选择文本或图像，用它来表示链接的音频文件–在“属性”面板中，将音频文件名输入链接文本框中•在网页中嵌入声音文件–将光标置于要放置音频文件的位置–执行“插入记录”的“媒体”的“plug”命令，在“Plug-in源”文本框中输入音频文件名•在网页中嵌入背景音乐–将光标置于网页上部，执行“插入记录”的“媒体”的“plug”命令，在“Plug-in源”文本框中输入音频文件名–在“属性”面板中的“高度”和“宽度”设置为2上机作业•制作一个动态的网页，包含下列元素–Flash动画–Flash按钮–JavaApplet–使用CSS样式表制作特殊文字效果–给网页增加音频文件