2015教科版选修3《制作动态网页》word教案.docVIP

1.2动态网页制作 学习目标 （1 （2DHTML的应用。 1.2.1在FrontPage中插入横幅广告 操作步骤如下： （1）单击“开始”按钮，选择“程序” →“Microsoft FrontPage”，“Microsoft FrontPage”窗口，执行“文件” →“保存文件”命令，将新建文件保存为guanggao.htm。 （2）在FrontPage中执行“插入” →“组件” →“横幅广告管理器”命令，打开“横幅广告管理器属性”对话框，设置宽度为200，高度为100，过滤效果为“分解”，每幅图片显示3秒，单击“添加”按钮，将所需要的图片添加到“显示图片”列表框中，单击“上移”、“下移”按钮调整横幅广告图像变换的次序，单击“确定”按钮。 （3）保存后在浏览器中进行预览，每隔3秒钟变换一幅图片。 1.2.2 在FrontPage中应用动态HTML效果 在FrontPage中应用动态HTML效果，操作步骤如下： （1）单击“开始”按钮，选择“程序” → “Microsoft FrontPage”。打开“Microsoft FrontPage”窗口，执行“文件” →“保存文件”命令，将新建文件保存为dtsg.htm。 （2）在FrontPage窗口中输入文本“助理电子商务师”，然后选中文本执行“格式” →“动态HTML效果”命令，在出现的“HTML效果”工具栏中进行设置。 （3CSS样式文件 使用FrontPage建立名为mystyle.css的外部CSS样式文件，并在其他页面文件中应用此样式文件。 1.创建CSS样式文件 操作步骤如下： （1）单击“开始”按钮，选择“程序” →“Microsoft FrontPage”，打开“Microsoft FrontPage”窗口。 （2）在FrontPage窗口中，选择“文件” →“新建” →“网页”，在“新建”对话框中单击“样式表”选择卡，选择要创建的样式类型，然后单击“确定”按钮。 （3）单击样式工具栏中的样式按钮，弹出“样式”对话框。 （4）单击“样式”对话框中的“新建”按钮，弹出“新样式”对话框，在“名称（选择器）”中输入样式名称，单击“格式”按钮进行字体、段落、边框等设置，新建样式的设置。 （5）单击“确定”按钮后，会在“样式”对话框的样式栏中显示用户自定义的样式。再单击“确定”按钮，完成样式文件的创建。 （6）执行“文件” →“保存文件”命令，保存文件。 2.应用外部CSS样式 操作步骤如下： （1）新建页面文件并进行保存操作，输入文字内容“这是样式的应用”。 （2）执行“格式” →“样式表链接”命令，在打开的“链接样式表”对话框中进行设置，选择“所选的网页”选项，单击“添加”按钮选择所要链接的样式表文件，单击“确定”按钮。 （3）选中文字，切换到HTML视图下，将body区中的“p这是样式的应用/p”HTML语句修改为“p class=“test”这是样式的应用/p”，保存文件后浏览效果。 大多数时候可以不为具体的HTML 相关知识 （一）DHTML 1、DHTML的定义 又称动态网页，它将内容对象化，应用编程语言来操作页面上的对象，不必通过服务器就可以与用户交互信息，更新页面的内容。动态见面技术包括javascript、vbscript、css、layer等。 ２、DHTML的基本结构 DHTML的基本结构包括HTML、CSS、脚本程序、浏览器对象和网页对象等。 DHTML 是基于HTML语言，通过CSS技术扩展了HTML的样式定义语法和语义，用脚本程序或控制浏览器对象和网页对象，从而使页面具有动态效果和交互功能。 （二）CSS层叠样式表 CSS是一种用于定义网页内容显示样式的技术。通过样式可以设定许多属性，如字号，颜色，页边距等。 样式表的建立要符合CSSHTML标志{标志属性:属性值；标志属性:属性值；标志属性:属性值；标志属性:属性值；...} （三）脚本语言 1.脚本语言(JavaScript,VBscript等)介于HTML和C,C++,Java,C#等编程语言之间。HTML 2.脚本语言与编程语言也有很多相似地方，其函数与编程语言比较相象一些,其也涉及到变量。与编程语言之间最大的区别是编程语言的语法和规则更为严格和复杂一些。 3.与程序代码的关系:脚本也是一种语言，其同样由程序代码组成。注：脚本语言一般都有相应的脚本引擎来解释执行。 4.vbscript， javascript，installshield script等等，它不象c\c++等可以编译成二进制代码，以可执行文件的形式存在。脚本语言一般都是以文本形式存在,bgsound背景音乐标记符可以在展示页面的同时播放音乐，通常插在head…/head区中[示例]使用bgsound背景