《HTML+CSS网页设计与布局》教案.docx

《HTML+CSS网页设计与布局》教案.docx

《《HTML+CSS网页设计与布局》教案.docx》由会员分享，可在线阅读，更多相关《《HTML+CSS网页设计与布局》教案.docx（31页珍藏版）》请在冰点文库上搜索。

《HTML+CSS网页设计与布局》教案

《HTML+CSS网页设计与布局》课程教案

授课教师：

授课班级：

地点:

周课时：

5课时

章节

内容

网页设计基础知识

Dreamweaver软件介绍及其基础操作

HTML基础知识及常用标记

教学

目标

1）使学生了解网页设计的相关基础知识；

2）使学生熟悉Dreamweaver软件界面的基本操作方法。

重点

难点

1）了解网页设计相关概念和网页的类型；

2）熟练掌握Dreamweaver软件创建和管理站点的方法。

教学

方法

课堂讲授、案例讲解与指导

教学

环境

计算机机房

教学过程及内容提要

时间

分配

备注

教学过程设计

一、引入

1、相互认识，提出与本学科相关的知识，介绍本门课程情况、教学内容及总学时数进度安排,宣讲本课程教学纪律,鼓励学生营造一种学习氛围，尊重同学，互帮互学,真正达到学以致用；

2、提出问题：

上过网吧？

有谁自学过网页设计?

听说过HTML或者CSS这两个概念吗?

二、告知学生课堂任务

本次课所学习的主要内容是HTML相关基础知识和Dreamweaver软件基础操作；

三、逐步演示讲解分析教学内容

1、网站和网页的区别：

（1）网页是Internet基本元素；

（2）网站由网页组成;

2、静态网页和动态网页:

静态网页：

纯粹HTML语言格式的网页通常被称为静态网页，静态网页的后缀名通常为.htm、。

html、。

shtml、。

xml。

动态网页：

许多人认为网页会动就是动态网页，这是个错误的观点，在静态的网页中也可以含有动态的图片，这仅仅是视觉上的动态罢了.真正的动态网页是指实际上并不是独立存在于服务器上的网页文件，只有当用户请求时服务器才返回一个完整的网页。

也就是说，它是返回到了客户端上的网页。

例如网页文件是以ASP、PHP、JSP、ASPX为结尾就是动态的网页了。

静态网页的特点:

（1）内容相对稳定，容易被搜索引擎检索到；

（2）没有数据库支持，在网站制作和维护方面工作量大;

（3）交互性差,在功能方面有很大的限制。

动态网页的特点：

（1）以数据库技术为基础，可大大降低网站维护的工作量；

（2）可实现更多的功能,如用户注册、新闻发布、在线留言等；

（3）不利于使用搜索引擎进行网站推广。

3、常见网页类型:

形象页、主页、栏目页、内页、新闻详细页等;

4、网页设计原则：

（1）了解客户需求

（2）遵循Web标准

（3）运用形式美法则

5、网页设计流程：

（1）手绘效果图：

确定网页主题内容和风格

（2）设计效果图：

搜集、整合设计所需素材

（3）版面编辑：

网页的制作与实现

（4）网页美化：

动画设计,网页测试和发布

6、网页设计的主要软件：

（1）Photoshop

（2）Dweamveawer

（3）Flash

（4）Firworks

7、HTML基础知识：

（1）HTML概念：

HyperTextMarkupLanguage超文本标识语言；

（2）HTML文档的编写方法：

用记事本手工直接编写、使用可视化HTML编辑器Dreamweaver、由Web服务器动态生成；（3）网页文件命名：

首页文件名默认为：

index。

htm或index。

html;（4）HTML文件结构：

（5）用编辑器手工编写第一张网页；

8、学生实训及辅导；

9、Dreamweaver软件界面介绍:

（1）软件面板组成及基本操作方法

（2）软件首选参数设置

10、Dreamweaver站点创建:

站点-〉新建站点-〉设置站点名称—>设置站点默认图像文件夹。

11、学生实训操作：

Dreamweaver站点创建与设置；

12、Dreamweaver创建第一个网页:

（1）名称：

index.html

（2）设置标题、输入文本、输入特殊字符

（3）页面属性设置

（4）预览网页

13、学生实训及辅导；

14、HTML常用标记：

（1）标题标记：

主题文字

（2）段落标记：

〈p〉这里表示段落

—-这里放注释-->（4）粗体与斜体:

〈b〉粗体（5）删除线与下划线：

〈s〉删除线〈/s>、〈u〉下划线（6）上标与下标：

〈sup>上标

15、学生实训及辅导;

16、字体标记：

（1）字体大小：

（2）字体颜色:

〈fontcolor="”>字体颜色〈/font〉（3）设置标题字体：

〈h＃>主题文字〈/h#〉（4）物理字体：

…〈/B>，将字符设置成粗体.〈I〉…〈/I>,将字符设置成斜体。

…〈/U〉,给字符增加下划线。

…〈/S〉，给字符增加删除线。

…

，将字符设置成上标字体.,将字符设置成下标字体。

（5）逻辑字体:

〈EM>…〈/EM>强调文字。

字体加重.〈CODE>…〈/CODE>显示编程代码.〈SAMP>…显示示例文字。

〈KBD〉…显示键盘按键文字。

缩小文字。

…〈/BIG〉放大文字。

17、字体标记实例讲解;

18、学生实训及辅导；

四、课外作业第3章上机实践.

五、课堂小结

本次课主要内容:

1、网页设计基础知识;

2、Dreamweaver基本使用方法;

3、HTML基础知识及常用标记；

约15分钟

约35分钟

约20分钟

约30分钟

约20分钟

约20分钟

约20分钟

约30分钟

约20分钟

约30分钟

约20分钟

约20分钟

约40分钟

学生理解

学生熟记

学生实践

学生实践

学生实践

学生实践

学生实践

总结

后记

《HTML+CSS网页设计与布局》课程教案

授课教师：

授课班级：

地点：

周课时：

5课时

章节

内容

文字布局

插入图像

超级链接

教学

目标

3）使学生熟练掌握HTML常用标记的基本使用方法；

4）使学生掌握HTML常用标记各种属性的含义和设置方法。

重点

难点

3）掌握各种HTML常用标记的基本使用方法；

4）熟记各种HTML常用标记的含义.

教学

方法

课堂讲授、案例讲解与指导

教学

环境

计算机机房

教学过程及内容提要

时间

分配

备注

教学过程设计

六、引入

3、回顾上周所学内容：

上周主要介绍了网页设计和HTML相关基础知识及Dreamweaver软件基础操作，重点介绍了HTML基础知识及常用标记；

4、提出问题：

网页中文字如何布局？

如何在网页中插入图像？

如何运用超级链接？

七、告知学生课堂任务

本次课所学习的主要内容是HTML文字布局和插入图像、超级链接的标记应用。

八、逐步演示讲解分析教学内容

19、换行控制：

文字一

20、不换行控制:

21、文字对齐：

align="＃”、

22、设置段落：

23、学生实训及辅导；

24、上周课外作业点评；

25、无序列表：

〈ul>

26、有序列表：

〈ol>〈li>表项一

27、欲格式化文本：

文字
28、计算机输出格式:
〈code>代码样式小型固定宽度字体显示的文本代码样式固定宽度字体渲染文本
29、学生实训及辅导；
30、在网页中插入图像:
〈imgsrc=”cn.jpg"〉
31、图像无法显示时的提示信息：
〈imgsrc="cn.jpg"alt="风景”>
32、控制图像的大小：
〈imgsrc=”cn.jpg”alt="风景"width=”400px"height=”300px”>
33、设置边框：
〈imgsrc="cn.jpg"alt="风景"border=”0px”>
34、图像的链接：
//www.baidu。
com”>〈/a〉
35、学生实训及辅导；
36、图像映射图：
37、文本与图像对齐：
38、学生实训及辅导；
39、最简单的文字超链：
〈ahref="”>文字链接
40、超链网页的打开方式：
_blank、_parent、_self、_top
41、链接的注释：
//”title="网易网站”>163网站
42、设置图片链接：
〈ahref=””>〈imgsrc=”">〈/a>
43、设置锚点：
〈aname="锚点名”>文章中的文字〈/a〉
44、邮箱地址链接：
leiningcn@163。
com">作者的邮箱
45、相对路径:
相对路径是指这个文件在所在的位置与其他文件或文件夹的关系；
46、绝对路径：
HTML绝对路径（absolutepath）指带域名的文件的完整路径。
47、学生实训及辅导；
九、课外作业第6章上机实践。
十、课堂小结
本次课主要内容：
1、HTML文字布局;
2、HTML插入图像；
3、HTML超级链接.
约10分钟
约30分钟
约30分钟
约40分钟
约20分钟
约20分钟
约30分钟
约30分钟
约20分钟
约30分钟
约30分钟
约30分钟
学生理解
学生实践
学生实践
学生实践
学生实践
总结
后记
《HTML+CSS网页设计与布局》课程教案
授课教师:
授课班级：
地点:
周课时：
5课时
章节
内容
表单的使用
插入表格
教学
目标
5）使学生熟练掌握HTML常用标记的基本使用方法；
6）使学生掌握HTML常用标记各种属性的含义和设置方法。
重点
难点
5）掌握各种HTML常用标记的基本使用方法；
6）熟记各种HTML常用标记的含义。
教学
方法
课堂讲授、案例讲解与指导
教学
环境
计算机机房
教学过程及内容提要
时间
分配
备注
教学过程设计
十一、引入
5、回顾上周所学内容:
上周主要介绍了HTML文字布局和插入图像的基本方法，重点介绍了超级链接的标记应用；
6、提出问题：
什么是表单？
常见的表单有哪些？
如何在网页中使用表格？
十二、告知学生课堂任务
本次课所学习的主要内容是HTML表单和表格的标记应用。
十三、逐步演示讲解分析教学内容
48、表单基本语法：
〈/form〉、属性action和method
49、文本框：
50、密码框：
〈inputtype=”password"〉
51、单选框：
52、复选框：
〈inputtype=”checkbox"〉
53、按钮设置：
〈inputtype="submit"value=”按钮提交">
54、学生实训及辅导；
55、上周课外作业点评；
56、下拉表:
〈！
—设置下拉表选项——〉〈option〉选项一〈/option〉
选项二〈/option〉选项三〈/select>绝对路径
57、文本域:
<！</p><p>-文本域内容-—〉</textarea〉</p><p>58、表单应用实例讲解；</p><p>59、学生实训及辅导;</p><p>60、表格基本语法：</p><p><table></table〉〈tr〉标签对表示表行<th>标签对表示表头〈td〉标签对表示表元</p><p>61、跨多行表元：</p><p>Rowspan</p><p>62、跨多列表元：</p><p>colspan</p><p>63、表格内设置文字对齐：</p><p>对齐语法用align表示，后面接的值是left、center和right，分别代表向左、居中和向右对齐复选框</p><p>64、表格在网页中对齐：</p><p>〈tablealign=#〉〈/table〉；</p><p>65、学生实训及辅导；</p><p>66、表格应用实例讲解；</p><p>67、学生实训及辅导；</p><p>十四、课外作业第8章上机实践。</p><p>十五、课堂小结</p><p>本次课主要内容:</p><p>1、表单的使用；</p><p>2、插入表格；</p><p>3、表格应用实例；</p><p>约10分钟</p><p>约30分钟</p><p>约40分钟</p><p>约30分钟</p><p>约20分钟</p><p>约20分钟</p><p>约40分钟</p><p>约30分钟</p><p>约40分钟</p><p>约20分钟</p><p>约40分钟</p><p>学生理解</p><p>学生实践</p><p>学生实践</p><p>学生实践</p><p>学生实践</p><p>总结</p><p>后记</p><p>《HTML+CSS网页设计与布局》课程教案</p><p>授课教师：</p><p>授课班级:</p><p>地点：</p><p>周课时：</p><p>5课时</p><p>章节</p><p>内容</p><p>网页框架</p><p>对象移动属性</p><p>多媒体对象应用</p><p>教学</p><p>目标</p><p>7）使学生熟练掌握HTML常用标记的基本使用方法;</p><p>8）使学生掌握HTML常用标记各种属性的含义和设置方法.</p><p>重点</p><p>难点</p><p>7）掌握各种HTML常用标记的基本使用方法；</p><p>8）熟记各种HTML常用标记的含义。</p><p>教学</p><p>方法</p><p>课堂讲授、案例讲解与指导</p><p>教学</p><p>环境</p><p>计算机机房</p><p>教学过程及内容提要</p><p>时间</p><p>分配</p><p>备注</p><p>教学过程设计</p><p>十六、引入</p><p>7、回顾上周所学内容:</p><p>上周主要介绍了HTML表单和表格的标记应用方法，重点介绍了表单的应用实例；</p><p>8、提出问题：</p><p>框架网页如何创建？</p><p>如何使网页中的对象移动?</p><p>如何在网页中插入Flash、影片、声音?</p><p>十七、告知学生课堂任务</p><p>本次课所学习的主要内容是HTML网页框架和对象移动属性、多媒体对象的标记应用。</p><p>十八、逐步演示讲解分析教学内容</p><p>68、框架的基本语法：</p><p>〈frameset>〈/frameset〉<frame〉〈/frame>〈framesetcols="25%，50%，25％"><framesrc="http：</p><p>//www。</p><p>hao123。</p><p>com/”>〈framesrc="http：</p><p>//www。</p><p>sina。</p><p>com。</p><p>cn/"〉<framesrc="http:</p><p>//www.163。</p><p>com/"></frameset〉</p><p>69、框架垂直分栏:</p><p>垂直分栏是在〈frameset〉中用cols表示跨多列表元，colspan</p><p>70、框架水平分栏：</p><p>水平分栏的语法用rows表示</p><p>71、设置不可调节框架大小：</p><p>noresize</p><p>72、学生实训及辅导；</p><p>73、上周课外作业点评；</p><p>74、浏览器不支持框架:</p><p><noframes〉〈/noframes〉</p><p>75、设置框架边框：</p><p>〈framesetframeborder=＃></p><p>76、设置滚动条：</p><p>设置滚动条在是〈frame>里面，用scrolling属性</p><p>77、导航框架：</p><p>导航框架是在网页框架的〈frame〉中加入name属性，表示该〈frame〉的名称，然后通过用〈a>标记的链接，并用target的属性值等于〈frame>的名称;</p><p>78、内联框架:</p><p>内联框架存在〈body></body〉的单个HTML文件中，可以链接其他网页并显示它,即在一个页面中嵌入一个框架窗口来显示另一个页面的内容，叫做浮动框架也称内联框架；</p><p>79、学生实训及辅导；</p><p>80、框架应用实例讲解；</p><p>81、学生实训及辅导；</p><p>82、移动属性基本语法：</p><p>〈marquee〉要移动的对象〈/marquee〉</p><p>83、文字的移动设置:</p><p>〈marqueedirection=＃>文字〈/marquee></p><p>84、图片移动的设置：</p><p><marquee>〈imgsrc="仙境.gif”〉〈/marquee></p><p>85、文本移动的方向：</p><p>〈marqueedirection=up〉向上移动〈/marquee〉</p><p>86、文本的滚动循环；</p><p>87、文本的移动速度：</p><p>scrollamount设置移动的速度</p><p>88、学生实训及辅导；</p><p>89、网页多媒体的基本语法：</p><p><embedsrc=urlloop="true|false”〉</p><p>90、隐藏面板的设置;</p><p>91、对齐方式：</p><p>align=top、bottom、center、baseline、left、right、texttop、middle、absmiddle、absbottom</p><p>92、学生实训及辅导；</p><p>93、移动对象应用实例讲解；</p><p>94、多媒体对象应用实例讲解；</p><p>95、学生实训及辅导；</p><p>十九、课外作业第11章上机实践。</p><p>二十、课堂小结</p><p>本次课主要内容：</p><p>1、网页框架；</p><p>2、对象移动属性；</p><p>3、多媒体对象应用。</p><p>约10分钟</p><p>约20分钟</p><p>约30分钟</p><p>约30分钟</p><p>约10分钟</p><p>约20分钟</p><p>约20分钟</p><p>约40分钟</p><p>约20分钟</p><p>约20分钟</p><p>约10分钟</p><p>约20分钟</p><p>约30分钟</p><p>约40分钟</p><p>学生理解</p><p>学生实践</p><p>学生实践</p><p>学生实践</p><p>学生实践</p><p>学生实践</p><p>学生实践</p><p>总结</p><p>后记</p><p>《HTML+CSS网页设计与布局》课程教案</p><p>授课教师:</p><p>授课班级:</p><p>地点：</p><p>周课时:</p><p>5课时</p><p>章节</p><p>内容</p><p>CSS基础知识</p><p>CSS字体设置</p><p>教学</p><p>目标</p><p>9）使学生熟练掌握CSS常用样式的创建方法；</p><p>10）使学生掌握CSS常用样式各种属性的含义和设置方法。</p><p>重点</p><p>难点</p><p>9）掌握各种CSS常用样式的基本使用方法；</p><p>10）熟记各种CSS常用样式的含义。</p><p>教学</p><p>方法</p><p>课堂讲授、案例讲解与指导</p><p>教学</p><p>环境</p><p>计算机机房</p><p>教学过程及内容提要</p><p>时间</p><p>分配</p><p>备注</p><p>教学过程设计</p><p>二十一、引入</p><p>9、回顾上周所学内容:</p><p>上周主要介绍了HTML网页框架和多媒体对象标记，重点介绍了HTML对象移动属性设置方法；</p><p>10、提出问题:</p><p>什么是CSS？</p><p>CSS有什么用？</p><p>如何创建和使用CSS？</p><p>二十二、告知学生课堂任务</p><p>本次课所学习的主要内容是CSS基础知识和CSS字体样式设置方法和技巧。</p><p>二十三、逐步演示讲解分析教学内容</p><p>96、CSS相关基础知识;</p><p>97、CSS文件链接方式:</p><p>（1）内联定义：</p><p>内联定义即是在对象的标记内，使用对象的style属性定义适用其的样式表属性。</p><p>链入内部CSS：</p><p>〈styletype=”text/css”>/*这里写CSS内容*/</style></p><p>（2）链接外部CSS：</p><p>〈linktype="text/css"rel="stylesheet”src=”style.css"〉</p><p>98、CSS在浏览器兼容性：</p><p>现在浏览器市场的主流浏览器主要是InternetExplorer（简称IE）和MozillaFirefox（简称FF）,网页中的CSS因两个浏览器支持不同，所以对同一代码会显示不同的效果，那么为了达到网页的风格，有时要注意哪个浏览器要写的CSS属性支持如何。</p><p>如果某一属性只有一个浏览器支持,那么另一浏览器对这属性代码就不起作用.</p><p>99、CSS选择符:</p><p>CSS选择符就是CSS样式的名字，选择符的命名规则可以使用英文字母的大写与小写、数字、连字号、下划线、冒号、句号，CSS选择符只能以字母开头，选择符在CSS中可分成多种，在本小节中只介绍常用的CSS选择符:</p><p>HTML标签选择符、ID选择符和CLASS（类选择符）选择符。</p><p>100、CSS伪类和伪元素：</p><p>伪类:</p><p>伪类选择符是基于一组预定义性质的选择符，HTML元素可以占有这些预定义性质。</p><p>实际上这些性质与class属性的功能是相同的，因此在CSS术语中，它们被称作伪类。</p><p>在对应这些伪类的标记中,不存在真正的class属性，相反，它们代表应用到这些元素的某些方面，或者是相对于该元素的浏览器用户界面的状态。</p><p>101、CSS常用单位：</p><p>em:</p><p>（em，元素的字体的高度）.</p><p>ex：</p><p>（x—height,字母"x"的高度）。</p><p>px：</p><p>（像素,相对于屏幕的分辨率）。</p><p>绝对长度单位：</p><p>in：</p><p>（英寸,1英寸=2。</p><p>54厘米）。</p><p>cm：</p><p>（厘米，1厘米=10毫米）。</p><p>mm:</p><p>（毫米，1米=1000毫米）。</p><p>pt：</p><p>（点，1点=1/72英寸）.</p><p>pc：</p><p>（帕，1帕=12点）。</p><p>102、上周课外作业点评；</p><p>103、学生实训及辅导；</p><p>104、字体和字体颜色：</p><p>font：</p><p>font-style｜|font-variant|｜font-weight|｜font—size｜｜line-height||font—family</p><p>105、字体大小:</p><p>Font—size，后面可接的参数值有：</p><p>xx-small｜x-small|small|medium|large｜x—large|xx-large|larger|smaller|length</p><p>106、字体重量：</p><p>Font-weight：</p><p>normal｜bold｜bolder｜lighter|100|200|300｜400｜500｜600｜700｜800|900</p><p>107、行距:</p><p>line-height:</p><p>#；</p><p>108、字体类型：</p><p>Font-family：</p><p>fontname;</p><p>109、行距:</p><p>line—height:</p><p>＃;</p><p>110、间距与间隔：</p><p>word-spacing：</p><p>normal|长度单位、letter—spacing：</p><p>normal|length</p><p>111、字体应用实例讲解；</p><p>112、学生实训及辅导；</p><p>二十四、课外作业第16章上机实践。</p><p>二十五、课堂小结</p><p>本次课主要内容：</p><p>1、CSS基础知识；</p><p>2、CSS文件链接方式；</p><p>3、CSS字体设置。</p><p>约10分钟</p><p>约40分钟</p><p>约40分钟</p><p>约60分钟</p><p>约50分钟</p><p>约40分钟</p><p>约80分钟</p><p>学生理解</p><p>学生实践</p><p>学生实践</p><p>总结</p><p>后记</p><p>《HTML+CSS网页设计与布局》课程教案</p><p>授课教师:</p><p>授课班级:</p><p>地点：</p><p>周课时：</p><p>5课时</p><p>章节</p><p>内容</p><p>CSS文本设置</p><p>CSS背景设置</p><p>对象尺寸设置</p><p>教学</p><p>目标</p><p>11）使学生熟练掌握CSS常用样式的创建方法；</p><p>12）使学生掌握CSS常用样式各种属性的含义和设置方法。</p><p>重点</p><p>难点</p><p>11）掌握各种CSS常用样式的基本使用方法；</p><p>12）熟记各种CSS常用样式的含义.</p><p>教学</p><p>方法</p><p>课堂讲授、案例讲解与指导</p><p>教学</p><p>环境</p><p>计算机机房</p><p>教学过程及内容提要</p><p>时间</p><p>分配</p><p>备注</p><p>教学过程设计</p><p>二十六、引入</p><p>11、回顾上周所学内容:</p><p>上周主要介绍了CSS基础知识和CSS文件链接方式,重点介绍了CSS字体样式设置方法；</p><p>12、提出问题:</p><p>如何用CSS进行文本和背景设置？</p><p>如何控制网页中的对象尺寸？</p><p>二十七、告知学生课堂任务</p><p>本次课所学习的主要内容是CSS文本设置和背景设置、对象尺寸设置的方法和技巧。</p><p>二十八、逐步演示讲解分析教学内容</p><p>113、字母大小写转换:</p><p>text-transform：</p><p>capitalize｜uppercase｜lowercase|nonecapitalize：</p><p>使每个词的首字母大写</p><p>uppercase:</p><p>使每个字的所有字母大写</p><p>lowercase：</p><p>使每个字的所有字母小写</p><p>none：</p><p>字母以正常形式显示</p><p>1</p>
                        </div>
                    <div class="page_view" id="pageContainer" oncontextmenu="return false">
                        <!--end documenttopic-->
                    </div>
                   <div  id="outer_page_more" style="margin-bottom:20px;background-color:#FFF; border:solid 1px #ccc; box-shadow:none; ">

                        <div class="inner_page_more" id="page_more" style="width: 920px; overflow:hidden;  line-height: 30px;">
                            <div id="html-reader-go-more" class="banner-wrap more-btn-banner" style="padding: 30px 0px;
                                width: 920px; position:relative;"> 
                            <div id="loading" style="text-align:center;width: 920px; padding-bottom:100px; font-size: 18px; line-height:40px;">
                        <img src="https://static.bingdoc.com/images/loading.gif" alt="加载" /><br />
                        文档加载中……请稍候！<br /> 
                        <a rel="nofollow" href="https://www.bingdoc.com/p-1343683.html" style="color:blue;text-decoration:underline;">如果长时间未打开，您也可以点击刷新试试。</a>
                        </div>
                        
                                <p style="text-align: center; font-size: 18px;">
                                     
                                <span id="ftip">下载文档到电脑，查找使用更方便</span>
                                </p>
                                
                                <!--
								<p style="text-align: center; font-size: 14px;">
                                        
                                  <b></b><span><b style="color: #ff0000">3</b>
                                        金币</span></p>
					  -->
                                
                                <p style="text-align: center; padding-top: 15px;">
                                    
                                    <table style="margin:0px auto;"><tr><td>
                                    <a target="_parent" rel="nofollow" href="https://www.bingdoc.com/d-1343683.html" class="ui-bz-btn-senior banner-download"
                                        style="padding: 5px 35px;  font-size: 15px; text-decoration: none"><b
                                            style="color: #fff">下载</b></a></td><td>   <a rel="nofollow" target="_blank" href="https://www.bingdoc.com/UserManage/Recharge.aspx?f=0&d=1343683" class="ui-bz-btn-senior2 banner-download"
                                                style="padding: 5px 35px; font-size: 15px; text-decoration: none"><b 
                                                    style="color: #fff">加入VIP,免费下载</b></a></td></tr>
                                     </table>
                                </p>
                                
                                    <p id="ntip" style="text-align: center;  padding-top: 30px;">
									<div id="ntip" class="banner-more-btn"
                                         style="text-align: center;  width: 250px; display:block; margin:20px auto;" onclick="showmorepage()">
                                        <span class="moreBtn goBtn" style="text-align: center"><span>还剩<span id="spanpage"></span>页未读，</span><span
                                            class="fc2e">继续阅读</span></span><p class="down-arrow goBtn"></p>
                                    </div> 
                                 
                            </div>
                        </div> 
                    </div>  

                    <div class="works-manage-box shenshu"> 
                    <a rel="nofollow" href="javascript:jubao()" title="举报" class="fLeft works-manage-item works-manage-report">
                        <span class="inline-block ico ">
                            <img src="https://static.bingdoc.com/images/jubao.jpg" alt="举报"></span>
                        <br>
                        举报</a>  
                        <a rel="nofollow" href="https://www.bingdoc.com/UserManage/CopyrightAppeal.aspx?bid=1343683" title="版权申诉" class="fLeft works-manage-item works-manage-report" target="_blank"
                            <span class="inline-block ico"> <img src="https://static.bingdoc.com/images/bang_tan.gif" width="18" alt="版权申诉"></span>
                            <br>
                            版权申诉</a> 
                        <a rel="nofollow"  class="fLeft" style="display:block; padding-top:17px; padding-left:20px;font-size:14px;">
                            word格式文档无特别注明外均可编辑修改；预览文档经过压缩，下载后原文更清晰！
                              </a>
                                 <a target="_parent" rel="nofollow" href="https://www.bingdoc.com/d-1343683.html" title="点击进入下载" class="fr hover-none works-manage-download">
                                    <em class="mr5">立即下载</em><span class="download-ico2 ico inline-block vertical-middle"></span></a>
                        <input type="hidden" value="1332" id="tu_id">
                    </div>
                    <dl class="works-intro gray2 cl pb10" style="border-bottom: none; padding-bottom: 0">
                        
                        <dt class="fl">配套讲稿：</dt><dd class="fl wordwrap" style="color:#666666"><p>如PPT文件的首页显示<font color="#FF0000">word图标</font>，表示该PPT已包<font color="#FF0000">含配套word讲稿</font>。双击word图标可打开word文档。
                         </p></dd>						
                        <dt class="fl">特殊限制：</dt><dd class="fl wordwrap" style="color:#666666"><p>部分文档作品中含有的国旗、国徽等图片，仅作为作品整体效果示例展示，禁止商用。设计者仅对作品中独创性部分享有著作权。</p></dd>						
                        <dt class="fl">关 键  词：</dt><dd class="fl wordwrap">
                            HTML+CSS网页设计与布局
                            HTML
                            CSS
                            网页
                            设计
                            布局
                            教案
                            
                        </dd>
                    </dl> 

                     
                    <div class="works-intro gray2 c666">
                        <span class=" notice-ico">
                            <img alt="提示" src="https://static.bingdoc.com/images/bang_tan.gif" style="padding-left: 24px; vertical-align: middle"></span> 
                        冰点文库所有资源均是用户自行上传分享，仅供网友学习交流，未经上传用户书面授权，请勿作他用。
                    </div> 
                  
                
            <!--ta的资源-->
                <div class="mt10 related-pic-box" id="brandlist" style="height: 450px;"> 
                    <div class="works-comment-hd">
                        该用户的其他资源 <a rel="nofollow"  href="https://www.bingdoc.com/user/295.html" class="fr" style="font-size: 12px;
                            font-weight: normal" hidefocus="true" target="_blank">更多>></a></div>
                    <div id="related-pic-list" class="related-pic-list cl" style="padding-left:12px; padding-right:0px;">
                        <ul>
                            
                                    <li><h3><a href="https://www.bingdoc.com/p-2349110.html" target="_parent" title="整编新型生态农业旅游休闲农庄项目发展建设市场研究报告.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/ef69adfc-6c88-48ce-8096-3e59a8bedafa/311b6802f06d45be83b789cfa2956001.gif'
                                            alt="整编新型生态农业旅游休闲农庄项目发展建设市场研究报告.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        整编新型生态农业旅游休闲农庄项目发展建设市场研究报告.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349111.html" target="_parent" title="证券投资顾问业务暂行规定.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/2667d684-80c2-4500-89ba-a7cf5f5cc953/4a6fcf0d24884f95bc021db6848958f8.gif'
                                            alt="证券投资顾问业务暂行规定.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        证券投资顾问业务暂行规定.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349112.html" target="_parent" title="知识产权法司法考试历年真题及答案解析.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/05d11d27-6db9-468a-b4c1-da259a818d81/11cbd532d51d4a9f9a160774e693124a.gif'
                                            alt="知识产权法司法考试历年真题及答案解析.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        知识产权法司法考试历年真题及答案解析.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349113.html" target="_parent" title="职业道德的复习重点.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/03804611-aa2c-4245-89d9-6553d5e7c0db/b6910c68cb614113b469b99ae82e8eb9.gif'
                                            alt="职业道德的复习重点.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        职业道德的复习重点.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349114.html" target="_parent" title="志愿者活动心得精选多篇.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/5e641dcb-e34c-452b-929d-0f14610a759c/fdefbc95551742baa1cc57475ed63a28.gif'
                                            alt="志愿者活动心得精选多篇.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        志愿者活动心得精选多篇.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349115.html" target="_parent" title="治理雾霾应重视大气静电学说.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/d9a0c44f-315b-4f88-9e61-b152debe1500/751cd09d7752419aa8026840f93b13b6.gif'
                                            alt="治理雾霾应重视大气静电学说.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        治理雾霾应重视大气静电学说.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349116.html" target="_parent" title="中国成人脑死亡判定标准与操作规范第二版.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/9d676250-ccb1-41a4-9db4-b69410c05dab/081512ddee2643bf80321ed77dfdbdac.gif'
                                            alt="中国成人脑死亡判定标准与操作规范第二版.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        中国成人脑死亡判定标准与操作规范第二版.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349117.html" target="_parent" title="中国名牌产品申请表.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/543c4741-7073-4f1c-ad02-4994983877a5/7d073988e2714ec7bcb4d34fd5d40a68.gif'
                                            alt="中国名牌产品申请表.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        中国名牌产品申请表.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349118.html" target="_parent" title="中国纸板产业深度调研及产业投资评估报告.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/bb25b272-32a5-4ab7-9b75-0bf61d1b4545/d9df21ed980646b7b9f563a95164b35e.gif'
                                            alt="中国纸板产业深度调研及产业投资评估报告.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        中国纸板产业深度调研及产业投资评估报告.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349119.html" target="_parent" title="中考化学考点分类解析导学案14第3讲碳和碳的氧化物1碳单质的物理性质和用途.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/0f287db8-5e1c-47d1-a10c-20f292bb1d10/07be2909c54e41269bc0f7597a4c9c83.gif'
                                            alt="中考化学考点分类解析导学案14第3讲碳和碳的氧化物1碳单质的物理性质和用途.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        中考化学考点分类解析导学案14第3讲碳和碳的氧化物1碳单质的物理性质和用途.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349120.html" target="_parent" title="中学学年度第二学期学校工作计划.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/46701474-d8ef-4f44-9a28-5b7a55adee5c/a4739c34c64444c1af3a1cb614d13bde.gif'
                                            alt="中学学年度第二学期学校工作计划.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        中学学年度第二学期学校工作计划.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349121.html" target="_parent" title="中英文安全标语word版本 26页.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/8107b7d8-42a1-4bce-bd01-3eea9a86ce05/f5e46d77b62d4ad283710a373167cbb0.gif'
                                            alt="中英文安全标语word版本 26页.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        中英文安全标语word版本 26页.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349122.html" target="_parent" title="重庆市高考英语试题.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/a47b300a-d151-4a5d-8319-0e6edafeeb79/8ebbd8990867469db40d6b6346e2a3c2.gif'
                                            alt="重庆市高考英语试题.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        重庆市高考英语试题.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349123.html" target="_parent" title="注册安全工程师《安全生产管理知识》真题及答案.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/6723ed12-fe88-4858-a767-8939bf3b8e5d/d23411a5927c4887a7f88a3860336182.gif'
                                            alt="注册安全工程师《安全生产管理知识》真题及答案.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        注册安全工程师《安全生产管理知识》真题及答案.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349124.html" target="_parent" title="装机必备硬件基础知识再接再厉完成装机.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/425c1da9-aa0c-42cb-b97b-741becc89cfb/64bb7615f38c47a989a39aee357b3ce0.gif'
                                            alt="装机必备硬件基础知识再接再厉完成装机.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        装机必备硬件基础知识再接再厉完成装机.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349125.html" target="_parent" title="子部.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/8772c64c-529d-4639-9110-36b9e4b45533/187229b9b095448aa4c585db40b72a6a.gif'
                                            alt="子部.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        子部.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349126.html" target="_parent" title="总结范文骨干教师培训总结15篇.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/de474925-0749-43e7-8db5-c006c974bc0d/e8f6dff978dc442da8e4dd9904061dab.gif'
                                            alt="总结范文骨干教师培训总结15篇.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        总结范文骨干教师培训总结15篇.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349127.html" target="_parent" title="最新 Marlin固件全中文解析.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/55e2393b-f6d3-4f2b-8ddb-11965c5f3792/85eaba9001754b01bf2b36704a5b1fdf.gif'
                                            alt="最新 Marlin固件全中文解析.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        最新 Marlin固件全中文解析.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349128.html" target="_parent" title="最新部编版三年级语文上册第24课《司马光》教学设计.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/03bb3b9a-f538-4984-abb9-2852563734a0/7715a3144c144fc3a7d7871907746e66.gif'
                                            alt="最新部编版三年级语文上册第24课《司马光》教学设计.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        最新部编版三年级语文上册第24课《司马光》教学设计.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349129.html" target="_parent" title="最新二年级数学上册寒假作业全面系统146.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/3f05126b-adbd-4049-8adc-54d9a950b2c8/7c4e7ed0c629488a9668fa4c7f9bef50.gif'
                                            alt="最新二年级数学上册寒假作业全面系统146.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        最新二年级数学上册寒假作业全面系统146.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349130.html" target="_parent" title="最新猴年祝贺词大全 精品.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/6a3b5c77-5f52-4eeb-8272-5133d01b39b7/f04a9d0255cf4ac6b9ce68818d90ca9b.gif'
                                            alt="最新猴年祝贺词大全 精品.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        最新猴年祝贺词大全 精品.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349131.html" target="_parent" title="最新入党思想报告3000字范文思想汇报文档五篇.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/a67f7165-1b5d-4631-a26e-c0ce188d6e8c/36435aefeaed4b7c88260b72300ef6e9.gif'
                                            alt="最新入党思想报告3000字范文思想汇报文档五篇.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        最新入党思想报告3000字范文思想汇报文档五篇.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349132.html" target="_parent" title="《OTL功率放大器的制作与调试》项目教学设计方案.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/21b96126-914d-4c77-84c3-4f61bc583e25/64731d55bda4489f9a399c00aa684385.gif'
                                            alt="《OTL功率放大器的制作与调试》项目教学设计方案.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        《OTL功率放大器的制作与调试》项目教学设计方案.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2349133.html" target="_parent" title="《化学方程式》单元检测2.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/f715dcbe-e2d0-476a-a89b-1260670d91d2/cf320e59315b4318abcc5fa22b18f44b.gif'
                                            alt="《化学方程式》单元检测2.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        《化学方程式》单元检测2.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2328946.html" target="_parent" title="中考语文阅读精品题.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/9c079624-d170-4b53-92a1-a32b0d58ae4c/574b73c7706d4f69bddbc5fcc193c713.gif'
                                            alt="中考语文阅读精品题.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        中考语文阅读精品题.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2328953.html" target="_parent" title="工伤司法鉴定标准是怎样的.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/cbe1f9d2-b394-43f8-b786-f9c7734412c2/76fd8aa07a3d47a2aa8e7b7ad523bc69.gif'
                                            alt="工伤司法鉴定标准是怎样的.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        工伤司法鉴定标准是怎样的.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2328956.html" target="_parent" title="公共事务管理硕士在职专班入学研究计画书.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/99b4e619-e0c3-46b7-a8db-e31d52bfac68/4c6ddb380c184410975c469371e8ce23.gif'
                                            alt="公共事务管理硕士在职专班入学研究计画书.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        公共事务管理硕士在职专班入学研究计画书.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2328957.html" target="_parent" title="公考必备《行测》数量关系题库.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/68ab0bc8-ff67-4c78-8d12-a724bc3f5fb2/627b3652ac4745d39cd50dd021cf262e.gif'
                                            alt="公考必备《行测》数量关系题库.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        公考必备《行测》数量关系题库.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2328962.html" target="_parent" title="股票技术指标详解二.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/942d49cb-34cd-447a-a796-031a7f9d684d/4853be67b90245688e1ab05a4dd062ef.gif'
                                            alt="股票技术指标详解二.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        股票技术指标详解二.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2329610.html" target="_parent" title="人教版数学六下第二单元《百分数二》word教案精品教案.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/b486084b-ad2b-4f2b-adeb-19e04b257bb6/38eefe9a6adf49ab86a033d5e6035d53.gif'
                                            alt="人教版数学六下第二单元《百分数二》word教案精品教案.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        人教版数学六下第二单元《百分数二》word教案精品教案.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2329615.html" target="_parent" title="简大型机房建设系统全套设计方案.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/37c89b98-eaec-4e40-b58b-909f0d1d1161/91789e89658b44a49ad4b41cd0b77f63.gif'
                                            alt="简大型机房建设系统全套设计方案.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        简大型机房建设系统全套设计方案.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-2329620.html" target="_parent" title="建筑工程基础加固与纠偏处理应用探讨.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-5/2/7163febe-fb73-4a57-b67d-7d06df6808fa/b2616018c896424a9bb3acad261460ef.gif'
                                            alt="建筑工程基础加固与纠偏处理应用探讨.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        建筑工程基础加固与纠偏处理应用探讨.docx
                                    </a></h3></li>
                                
                        </ul>
                    </div>
                </div> 
             <div class="mt10 related-pic-box" id="Div1" style="height: 450px; overflow:hidden;"> 
                    <div class="works-comment-hd">
                        猜你喜欢  </div>
                    <div id="related-pic-list" class="related-pic-list cl" style="padding-left:12px; padding-right:0px;">
                        <ul> 
                            
                                    <li><h3><a href="https://www.bingdoc.com/p-13387242.html" target="_parent" title="版高考历史大一轮复习第30讲宗教改革和西方启蒙思想家的人文主义思想教学案北师大版.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/817a5351-6bfd-4746-a15e-049314f427fa/51001f12ff8546a582ee19f44717017c.gif'
                                            alt="版高考历史大一轮复习第30讲宗教改革和西方启蒙思想家的人文主义思想教学案北师大版.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        版高考历史大一轮复习第30讲宗教改革和西方启蒙思想家的人文主义思想教学案北师大版.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387243.html" target="_parent" title="办公室工作总结 3.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/0be82c69-1624-487a-8964-bbfcd566c683/5e79a4506ff94481ba0a1d19ad4d396d.gif'
                                            alt="办公室工作总结 3.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        办公室工作总结 3.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387244.html" target="_parent" title="保护环境共建绿色校园演讲稿.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/f413b952-ecda-4906-8fcc-36625b0faf41/95bb30da941d4bc19c353d9edd6284d3.gif'
                                            alt="保护环境共建绿色校园演讲稿.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        保护环境共建绿色校园演讲稿.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387245.html" target="_parent" title="报刊杂志的编辑流程.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/f0e22671-a039-458e-8eec-ce6543589688/7ff05c1cb622449b9cdf7e2db3085145.gif'
                                            alt="报刊杂志的编辑流程.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        报刊杂志的编辑流程.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387246.html" target="_parent" title="北京某度假村道路施工组织设计方案道路方案.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/b9079265-172b-485f-98c7-6333f043657d/43c1c4829b1244f28c4cdff325947171.gif'
                                            alt="北京某度假村道路施工组织设计方案道路方案.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        北京某度假村道路施工组织设计方案道路方案.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387247.html" target="_parent" title="北科大小学期软件课程设计报告.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/dc2490f8-9903-4c38-adcb-434167a5cdf2/49102b7b41dd43468e71c1afc1293782.gif'
                                            alt="北科大小学期软件课程设计报告.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        北科大小学期软件课程设计报告.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387248.html" target="_parent" title="北师大五年级上册书法教学课程目标.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/e04c31d8-0e02-4b95-9b34-39171a4d5939/e8467ca549ff43218eeb42d758b2e8eb.gif'
                                            alt="北师大五年级上册书法教学课程目标.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        北师大五年级上册书法教学课程目标.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387249.html" target="_parent" title="必备毕业实习自我鉴定汇总八篇.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/f37ee1c9-e43d-4ba5-8bb9-a5d2cccfd8f1/a500ece76c7d4c11a721e64ceef6e18e.gif'
                                            alt="必备毕业实习自我鉴定汇总八篇.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        必备毕业实习自我鉴定汇总八篇.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387250.html" target="_parent" title="毕业设计论文模板.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/1cc7bcf3-3a19-42e6-bddf-2b330c88481e/e02571f22b3e45029f4bd1625751868a.gif'
                                            alt="毕业设计论文模板.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        毕业设计论文模板.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387251.html" target="_parent" title="标准化茶叶加工厂建设投资项目商业计划书.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/5aced741-ec07-49e5-a1c6-de40373ccf4c/05b7c682dbb74335ad12934ff9df4578.gif'
                                            alt="标准化茶叶加工厂建设投资项目商业计划书.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        标准化茶叶加工厂建设投资项目商业计划书.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387252.html" target="_parent" title="艾格促销方案.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/4576f8ea-4c48-414d-b50e-72f8305718b1/cb18140ab0f64c838737f73cfdfed39e.gif'
                                            alt="艾格促销方案.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        艾格促销方案.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387253.html" target="_parent" title="泊位场地改造工程施工方案.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/b8f82040-f8b7-45a8-bed8-6cd4a8b6dc92/6cb6c461b97342d4aafb76fce212b56f.gif'
                                            alt="泊位场地改造工程施工方案.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        泊位场地改造工程施工方案.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387254.html" target="_parent" title="安全防护验收记录表剖析.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/1e25d219-6784-4202-af50-4de8918b2de9/650927f88c3c4e7b81823f5426792777.gif'
                                            alt="安全防护验收记录表剖析.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        安全防护验收记录表剖析.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387255.html" target="_parent" title="部编版六年级语文上册名言诗句谚语背诵清单汇总.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/20204e90-bcac-415c-995f-cfb43a0a8a99/241bacac296b4f4eae98c18b846cd2bd.gif'
                                            alt="部编版六年级语文上册名言诗句谚语背诵清单汇总.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        部编版六年级语文上册名言诗句谚语背诵清单汇总.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387256.html" target="_parent" title="安全生产监管执法年度工作计划与安全生产监管监察工作计划汇编.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/1fa417b6-0b66-4dad-8975-726f7effa343/7412604dc603409881919de10e7e2f4f.gif'
                                            alt="安全生产监管执法年度工作计划与安全生产监管监察工作计划汇编.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        安全生产监管执法年度工作计划与安全生产监管监察工作计划汇编.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387257.html" target="_parent" title="部编本人教版八年级下册语文最后一次讲演教案及练习.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/9c9cc705-e7a3-4c74-8bfa-9fa99dfc2d07/9cb84bd704b24217a8f7630f68124d06.gif'
                                            alt="部编本人教版八年级下册语文最后一次讲演教案及练习.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        部编本人教版八年级下册语文最后一次讲演教案及练习.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387258.html" target="_parent" title="安全知识百问百答.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/9a45a25a-c355-4990-82e4-17d68a82d873/684906f3a963429b8fdc410ff865aca5.gif'
                                            alt="安全知识百问百答.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        安全知识百问百答.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387259.html" target="_parent" title="材料力学实验指导.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/b7930ab4-49d4-45a5-bc8f-5ef11c7e9076/ed2405add3184bcd82c269fc2b0984bc.gif'
                                            alt="材料力学实验指导.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        材料力学实验指导.docx
                                    </a></h3></li>
                                
                                    <li><h3><a href="https://www.bingdoc.com/p-13387260.html" target="_parent" title="八年级地理下册走向世界的中国复习提纲.docx">
                                        <img   class="lazys" data-original='https://file1.bingdoc.com/fileroot1/2023-6/13/f556bf1b-d377-4b8a-ae4e-92a33750651a/69ae9d4ad847409099d982d2c443c4a7.gif'
                                            alt="八年级地理下册走向世界的中国复习提纲.docx" src="https://static.bingdoc.com/images/filetype/d_word.png">
                                        八年级地理下册走向世界的中国复习提纲.docx
                                    </a></h3></li>
                                
                        </ul>
                    </div>
                </div>       
                      
                    <div class="mt10 works-comment">
                        <div class="works-comment-hd">
                            <span class="font-tahoma">关于本文</div>
                        <div style="line-height: 25px; padding: 10px 20px;">
                            本文标题：《HTML+CSS网页设计与布局》教案.docx<br />
                            链接地址：<a rel="nofollow" href="https://www.bingdoc.com/p-1343683.html">https://www.bingdoc.com/p-1343683.html</a><br />
                        </div>
                        
                    </div>
                </div>
                 
                <div class="boxright" id="boxright" > 
                     
                    <div class="fr detail-aside" id="Div11" style="width:290px;">  
                        <div class="box hot-keywords mt10" id="relatebox">
                            <div class="boxHd" style="padding-bottom: 0px;">
                                <em></em><span>相关资源</span>
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=%e3%80%8aHTML%2bCSS%e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1%e4%b8%8e%e5%b8%83%e5%b1%80%e3%80%8b%e6%95%99%e6%a1%88.docx');" >更多</a>
                            </div>
                    <div id="author-works-list" class="author-works-list bgF">
					<ul>
                        
                        
                        
                        <li><img alt="html网页布局模板.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-6025114.html" title="html网页布局模板.docx">html网页布局模板.docx</a> 
        </li><li><img alt="html网页布局模板.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-7436062.html" title="html网页布局模板.docx">html网页布局模板.docx</a> 
        </li><li><img alt="html网页布局模板.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-12344032.html" title="html网页布局模板.docx">html网页布局模板.docx</a> 
        </li><li><img alt="html网页布局模板Word下载.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-7828086.html" title="html网页布局模板Word下载.docx">html网页布局模板Word下载.docx</a> 
        </li><li><img alt="html网页布局模板文档格式.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-8453606.html" title="html网页布局模板文档格式.docx">html网页布局模板文档格式.docx</a> 
        </li><li><img alt="《HTML+CSS网页设计与布局》教案范本模板.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-15688647.html" title="《HTML+CSS网页设计与布局》教案范本模板.docx">《HTML+CSS网页设计与布局》教案范本模板.docx</a> 
        </li><li><img alt="《HTML+CSS网页设计与布局》教案.doc" class="doc" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-4704324.html" title="《HTML+CSS网页设计与布局》教案.doc">《HTML+CSS网页设计与布局》教案.doc</a> 
        </li><li><img alt="HTML+CSS网页设计与布局教案.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-11671290.html" title="HTML+CSS网页设计与布局教案.docx">HTML+CSS网页设计与布局教案.docx</a> 
        </li><li><img alt="《HTML+CSS网页设计与布局》教案.docx" class="docx" src="/Images/s.gif" /><a target="_parent" href="https://www.bingdoc.com/p-11581050.html" title="《HTML+CSS网页设计与布局》教案.docx">《HTML+CSS网页设计与布局》教案.docx</a> 
        </li></div>
                        </ul>
						</div>
                         
                        <div class="box hot-keywords mt10" id="box3" style="overflow: hidden;width: 288px; border:solid 1px #dedede;">
                            <div class="boxHd" style="border: none;padding-bottom: 0px;">
                                <em></em><span>相关搜索</span>
                            </div>
                            <input name="ctl00$Content$hiddenCategoryID" type="hidden" id="Content_hiddenCategoryID" value="121" />  
                            <div class="hot-keywords-list">
                                
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=HTML%2bCSS%e7%bd%91%e9%a1%b5%e8%ae%be%e8%ae%a1%e4%b8%8e%e5%b8%83%e5%b1%80');"
                                    class="tag-item ico" title="HTML+CSS网页设计与布局" hidefocus="true"><span class="ico"><em>
                                        HTML+CSS网页设计与布局</em></span></a>
                                
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=HTML');"
                                    class="tag-item ico" title="HTML" hidefocus="true"><span class="ico"><em>
                                        HTML</em></span></a>
                                
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=CSS');"
                                    class="tag-item ico" title="CSS" hidefocus="true"><span class="ico"><em>
                                        CSS</em></span></a>
                                
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=%e7%bd%91%e9%a1%b5');"
                                    class="tag-item ico" title="网页" hidefocus="true"><span class="ico"><em>
                                        网页</em></span></a>
                                
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=%e8%ae%be%e8%ae%a1');"
                                    class="tag-item ico" title="设计" hidefocus="true"><span class="ico"><em>
                                        设计</em></span></a>
                                
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=%e5%b8%83%e5%b1%80');"
                                    class="tag-item ico" title="布局" hidefocus="true"><span class="ico"><em>
                                        布局</em></span></a>
                                
                                <a rel="nofollow" href="javascript:;" onclick="window.open('https://www.bingdoc.com/search.html?q=%e6%95%99%e6%a1%88');"
                                    class="tag-item ico" title="教案" hidefocus="true"><span class="ico"><em>
                                        教案</em></span></a>
                                
                            </div>  
                        </div> 
            <div class="job-recommend mt10">
                <h3 class="job-title"><svg t="1586228347294" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="https://www.w3.org/2000/svg" p-id="7996" 
                    width="20" height="20"><path d="M870 154c-13.1-13.1-30.4-21.8-49.8-24L527.8 97.5c-25.2-2.8-50.3 6-68.3 24l-326 326c-48.7 48.7-48.7 128.5 0 177.2l265.8 265.8c48.7 48.7 128.5 48.7 177.2 0l326-326c17.9-17.9 26.8-43.1 24-68.3L894 203.8c-2.2-19.4-10.9-36.8-24-49.8z m3.2 381.1l-326 326c-15.7 15.7-36.8 24.4-59.3 24.4s-43.5-8.7-59.3-24.4L162.9 595.3c-15.7-15.7-24.4-36.8-24.4-59.3s8.7-43.5 24.4-59.2l326-326c7.9-7.9 18.5-12.3 29.7-12.3 1.5 0 3.1 0.1 4.6 0.3l292.4 32.5c9.6 1.1 18.2 5.2 25 12 6.8 6.8 11 15.5 12.1 25.1l32.5 292.3c1.5 12.8-2.9 25.3-12 34.4z" p-id="7997" fill="#a2dbf8"></path><path d="M723.3 217.7c-45.8 0-83 37.2-83 83s37.2 83 83 83 83-37.2 83-83c0-45.9-37.1-83-83-83z m0 124.5c-22.9 0-41.5-18.6-41.5-41.5s18.6-41.5 41.5-41.5 41.5 18.6 41.5 41.5-18.6 41.5-41.5 41.5z" p-id="7998" fill="#a2dbf8"></path></svg> 
                    <a href="https://www.bingdoc.com/marks.html">文档标签</a></h3>
                <div class="job-recommend-area">
                    <ul class="taglist--inline multi">
                        <li class="tagPopup"><a class="tag tag0" href="https://www.bingdoc.com/mark/htmlwangyebujumoban.html"  target="_blank">html网页布局模板</a></li><li class="tagPopup"><a class="tag tag1" href="https://www.bingdoc.com/mark/htmlwangyeshejidaan.html"  target="_blank">HTML网页设计答案</a></li><li class="tagPopup"><a class="tag tag2" href="https://www.bingdoc.com/mark/divcsswangyebuju.html"  target="_blank">DIVCSS网页布局</a></li><li class="tagPopup"><a class="tag tag3" href="https://www.bingdoc.com/mark/divcsswangzhanshejibuju.html"  target="_blank">DIVCSS网站设计布局</a></li><li class="tagPopup"><a class="tag tag4" href="https://www.bingdoc.com/mark/csschangyongwangyebuju.html"  target="_blank">css常用网页布局</a></li><li class="tagPopup"><a class="tag tag0" href="https://www.bingdoc.com/mark/htmlwangyeshejijishu.html"  target="_blank">HTML网页设计技术</a></li><li class="tagPopup"><a class="tag tag1" href="https://www.bingdoc.com/mark/cssbuju40jiaocheng.html"  target="_blank">CSS布局40教程</a></li><li class="tagPopup"><a class="tag tag2" href="https://www.bingdoc.com/mark/htmlcsswangyeshejiyubujuhtmlcsswangye.html"  target="_blank">HTML+CSS网页设计与布局HTMLCSS网页</a></li><li class="tagPopup"><a class="tag tag3" href="https://www.bingdoc.com/mark/htmlwangyeshejijishuhtmlwangyesheji.html"  target="_blank">HTML网页设计技术HTML网页设计</a></li><li class="tagPopup"><a class="tag tag4" href="https://www.bingdoc.com/mark/wangyeshejizhizuohtml.html"  target="_blank">网页设计制作HTML</a></li>
                    
                </ul>
                </div>
            </div> 
         <div class="job-recommend">
                            <h3 class="job-title"><svg t="1586228347294" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="https://www.w3.org/2000/svg" p-id="7996" width="20" height="20"><path d="M870 154c-13.1-13.1-30.4-21.8-49.8-24L527.8 97.5c-25.2-2.8-50.3 6-68.3 24l-326 326c-48.7 48.7-48.7 128.5 0 177.2l265.8 265.8c48.7 48.7 128.5 48.7 177.2 0l326-326c17.9-17.9 26.8-43.1 24-68.3L894 203.8c-2.2-19.4-10.9-36.8-24-49.8z m3.2 381.1l-326 326c-15.7 15.7-36.8 24.4-59.3 24.4s-43.5-8.7-59.3-24.4L162.9 595.3c-15.7-15.7-24.4-36.8-24.4-59.3s8.7-43.5 24.4-59.2l326-326c7.9-7.9 18.5-12.3 29.7-12.3 1.5 0 3.1 0.1 4.6 0.3l292.4 32.5c9.6 1.1 18.2 5.2 25 12 6.8 6.8 11 15.5 12.1 25.1l32.5 292.3c1.5 12.8-2.9 25.3-12 34.4z" p-id="7997" fill="#ea986c"></path><path d="M723.3 217.7c-45.8 0-83 37.2-83 83s37.2 83 83 83 83-37.2 83-83c0-45.9-37.1-83-83-83z m0 124.5c-22.9 0-41.5-18.6-41.5-41.5s18.6-41.5 41.5-41.5 41.5 18.6 41.5 41.5-18.6 41.5-41.5 41.5z" p-id="7998" fill="#ea986c"></path></svg>
                                热门标签</h3>
                            <div class="job-recommend-area">
                                <ul class="taglist--inline multi">
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag1" href="https://www.bingdoc.com/mark/zaochanejixietongqicelue.html">早产儿机械通气策略</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag2" href="https://www.bingdoc.com/mark/wajuejicaozuoshigong.html">挖掘机操作施工</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag3" href="https://www.bingdoc.com/mark/shukongjichuanggongyejiqirendazao.html">数控机床工业机器人打造</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag4" href="https://www.bingdoc.com/mark/shukongjichuangweixiu.html">数控机床维修</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag0" href="https://www.bingdoc.com/mark/famenweihubaoyangpeixunjiaocai.html">阀门维护保养培训教材</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag1" href="https://www.bingdoc.com/mark/zhusumojuzhizuogongyi.html">注塑模具制作工艺</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag2" href="https://www.bingdoc.com/mark/yanzhigenghuanfenliedaoxian.html">研制更换分裂导线</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag3" href="https://www.bingdoc.com/mark/zhidongxitongjianceguzhangzhenduan.html">制动系统检测故障诊断</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag4" href="https://www.bingdoc.com/mark/taoshengjinjijiuhu.html">逃生紧急救护</a></li>
                                    
                                             <li class="tagPopup"><a target="_parent" class="tag tag0" href="https://www.bingdoc.com/mark/zidonghuashengchanxianrenzhi.html">自动化生产线认知</a></li>
                                    
                            </ul>
                            </div>
                        </div> 
    
            </div>
        </div> 
    </div> 
</div>  
        
    <script src="https://static.bingdoc.com/js/artDialog-5.0.3/artDialog.min.js"></script> 
        </div> 
     
    <div class="tempdiv cssnone" style="line-height:0px;height:0px; overflow:hidden;">
         
    </div> 
     
    <script>
        
        var doctitle = "《HTML+CSS网页设计与布局》教案.docx";
        Encoder.EncodeType = "entity";
        var nodecode = '0001600001';

        var adhtml = ""; 
        var adarray =  Encoder.htmlDecode(adhtml); 
       

        initWidth();

        var product_id = "1343683";
        var product_code = "1343683";
        var mtp = 20;  
        var fCount = 31;  
            
        var stp = 1;
        var lmt = 20;
        var ForceFreepage = parseInt('20');
        if(lmt > ForceFreepage)lmt = ForceFreepage;
        
        var mhs = 595 * 841;
        var mhi = new Array("342774");
        var mhls = new Array("0");
        var mfvs = new Array("0");
        var sw = 595;
        var sh = 841; 
        var IsDealSwfSize = sw > 0; 

        var minwidth=920;

        var BookMarkPage = parseInt('1');
        var adpagecount = parseInt("2");
        var defaultShowPage =parseInt( "5"); 
        var defaultShowPage2 =defaultShowPage; 

        
        var leftfilecount = fCount - defaultShowPage;
        if(leftfilecount<0)leftfilecount=0; 

        var scorename = "金币";
        var LimitText = '3';
        var LimitButtonText = '现在购买'; 
        var DocScoreDownLoad = parseFloat('3'); 
        var ReadLimitDays = "365";
          
        var bookrelArray = "";
        var url_root = "https://www.bingdoc.com/";

        var goumaiico = 'images/xiazai_1.gif';
        var  lmtext = '';
        
        lmtext = '<div class="inner_page_more" id="page_more" style="width:930px; height:260px; line-height:30px;">'
                    +'<div id="html-reader-go-more" class="banner-wrap more-btn-banner" style="padding-top:40px; width:930px;">'
                    +'<p style="text-align:center;font-size:18px;">亲，很抱歉，此页已超出免费预览范围啦！<br/>如果喜欢就下载吧，价低环保！</p><p style="text-align:center;font-size:14px;">'
                    +'<b></b><span><b style="color:#ff0000">3</b> 金币</span>'
                    
                    +'</p><p style="text-align:center; padding-top:30px;">'
                    +'<a target="_parent" rel="nofollow" href="https://www.bingdoc.com/d-1343683.html" class="ui-bz-btn-senior banner-download" style="padding:5px 35px; font-size:15px; text-decoration:none">'
                    +'<b style="color:#fff">立即下载</b></a>'
                    
                    +'   <a target="_blank" href="https://www.bingdoc.com/UserManage/Recharge.aspx?f=0&d=1343683"class="ui-bz-btn-senior2 banner-download" style="padding:5px 35px; font-size:15px; text-decoration:none">'
                    +'<b style="color:#fff">加入VIP,免费下载</b></a>'
                    +'</p></div></div>  ';
         
        var curtotalpage = defaultShowPage; 
        function showmorepage()
        {   
            var from = curtotalpage+1;
            var leftcount = ((mtp - curtotalpage)<defaultShowPage?mtp:(curtotalpage+defaultShowPage));
             
              
            for (var i = from; i <=leftcount; i++) { 
                Viewer._Addpage(i); curtotalpage+=1;
            }  
            leftfilecount = mtp - (curtotalpage); 
            Viewer._dfsp=curtotalpage;  
            if(from<leftcount)
            {
                Viewer.InitAD_left(from,leftcount); 
                showAd();
            }
            if(leftfilecount<=0)
            { 
                if("#ftip")$("#ftip").text("本资源只提供20页预览，全部文档请下载后查看！喜欢就下载吧，查找使用更方便");
                if($("#nftip"))$("#nftip").html("此文档不允许下载，在线阅读到最后一页了。");  
                $("#ntip").hide(); 
                $("#ntip2").hide(); 
                if($("#btnvip"))$("#btnvip").html("VIP查看完整版");  
                if("#ftip3")$("#ftip3").text(fCount-curtotalpage);
                if($("#ftip2"))$("#ftip2").show(); 

                if(fCount-curtotalpage <=0)
                {
                    if("#ftip2")$("#ftip2").text("预览完成，如需下载请加入VIP");
                    if($("#btnvip"))$("#btnvip").html("VIP免费下载");  
                }
            }
            var st = ($(this).scrollTop()); 
            $(this).scrollTop(st +1); 
            $("#spanpage").text(fCount-curtotalpage);
        }  
        function showmoretopage(to)
        {    
            var from = curtotalpage+1;
            var leftcount = ((mtp - curtotalpage)<defaultShowPage?mtp:(curtotalpage+defaultShowPage));
            
            if(to > leftcount)leftcount=to;
              
            for (var i = from; i <=leftcount; i++) { 
                Viewer._Addpage(i); curtotalpage+=1;
            }     
            leftfilecount = mtp - (curtotalpage); 
            Viewer._dfsp=curtotalpage;  
            if(from<leftcount)
            {
                Viewer.InitAD_left(from,leftcount); 
                showAd();
            }

            if(leftfilecount<=0)
            { 
                if("#ftip")$("#ftip").text("本资源只提供20页预览，全部文档请下载后查看！喜欢就下载吧，查找使用更方便");
                if($("#nftip"))$("#nftip").html("此文档不允许下载，在线阅读到最后一页了。");  
                $("#ntip").hide(); 
                $("#ntip2").hide(); 
                if($("#btnvip"))$("#btnvip").html("VIP查看完整版");  
                if("#ftip3")$("#ftip3").text(fCount-curtotalpage);
                if($("#ftip2"))$("#ftip2").show(); 
                
                if(fCount-curtotalpage <=0)
                {
                    if("#ftip2")$("#ftip2").text("预览完成，如需下载请加入VIP");
                    if($("#btnvip"))$("#btnvip").html("VIP免费下载");  
                }
            }
             
            $("#spanpage").text(fCount-curtotalpage);
            
        } 
        function adss()
        {var st = ($(this).scrollTop())-2; $(this).scrollTop(st);}
        function showAd()
        {
            $(".addivp").each(function(){
                var adindex = ($(this).attr("link"));  
                var adid = ($(this).attr("id"));   
                document.getElementById(adid).innerHTML = document.getElementById("adpre" + adindex).outerHTML;

                $("#adpre" + adindex).css({
                    margin: "0px auto" 
                }); 
                  
            }); 
        }
    </script> 
    <script>
        var operateType = 1;  
        var uid = "0";
        var DocID = "1343683";
        var zw = 595;
        var zh = 841;
        var zrate = (zw==0||zh==0)?1:(zh/zw);
         
        var isplay = 0;
                            

        var width = "830";
        var height = getClientHeight();
        if (height < 560) height = 560;
        height =  ('False' == 'True' ? 570 : height);
        
        var scorename = "金币";
        var params = {};
    </script> 
    <script src="https://static.bingdoc.com/master/view/view2.js"></script> 
    <script> 
        $(document).ready(function() {   
                
            
            initPage(); 
            $("#loading").hide(); 
        

            $("#spanpage").text(leftfilecount);
                 
            var lf = mtp - (defaultShowPage); 
                 
            if(lf<=0)
            { 
                if("#ftip")$("#ftip").text("本资源只提供20页预览，全部文档请下载后查看！喜欢就下载吧，查找使用更方便");
                if($("#nftip"))$("#nftip").html("此文档不允许下载，在线阅读到最后一页了。");  
                $("#ntip").hide(); 
                $("#ntip2").hide(); 
                if($("#btnvip"))$("#btnvip").html("VIP查看完整版");  
                if("#ftip3")$("#ftip3").text(fCount-curtotalpage);
                if($("#ftip2"))$("#ftip2").show(); 
                
                if(fCount-curtotalpage <=0)
                {
                    if("#ftip2")$("#ftip2").text("预览完成，如需下载请加入VIP");
                    if($("#btnvip"))$("#btnvip").html("VIP免费下载");  
                }
            }
                 
            window.setTimeout(
            function () {
                try
                {
                    if(BookMarkPage == 1)
                    {
                        
                        $(this).scrollTop(0);
                        
                    }
                    else
                    {
                        Viewer._GotoPage(BookMarkPage); 
                    }  
                }catch(e){}
            },500);  
            
            if(defaultShowPage>0){ $("#outer_page_more").show();}else{ $("#outer_page_more").hide();}
             
        }); 
    </script> 
    
    <script>   
        $('body').bind('contextmenu', function() {return false;}); 
        $('body').bind("selectstart",function(){return false;}); 
    </script> 
    <div class="cssnone">
        <iframe title = "来源分析" src="https://www.bingdoc.com/BookRead.aspx?id=m2P4cwEiBRg%3d" frameborder="0" style="width: 0px; height: 0px">
        </iframe>
    </div> 
    
            <!-- JiaThis Button END -->
            <span id="LabelScript"></span>
        </div>
    </div> 
     

<div class="getwximg_div" style="display:none;"> 
</div>
    <script>
        var isloginto = false;
        
        function initwxlogin() {
            
            var arr = $(".getwximg_div");
            for (var i = 0; i < arr.length; i++) {
                (function (index) {
                    var url = "https://www.bingdoc.com/header.aspx?getcate=100";
                    $.get(url + "&t=" + (new Date()).valueOf(), function (d) {
                        try {
                            arr.eq(index).empty().html(d);
                        } catch (e) { }
                        try {
                            arr.html(d);
                        } catch (e) { }
                    });
                })(i);
            }
        } 
    </script>

<script>function popLogin() {
    window.location.href = '/login.aspx?returl=https%3a%2f%2fwww.bingdoc.com%2fView_wj.aspx%3fid%3d1343683'; return; 
}</script>
 
    <script type="text/javascript">
        var objjubao = null;
        function jubao() {
            var html = '<iframe src="https://www.bingdoc.com/UserManage/ReportBack.aspx?id=1343683&url=rkm56XE mSSDVZKrWhxpD4j6KQFFmUMJWoQBQN8uJYiVNXX4ersFjQX6e2lw04kq" scrolling="no" frameborder="0" style="width: 600px; height: 420px"></iframe>';
            objjubao = art.dialog({
                title: '非法内容有奖举报', content: html,
                close: Closejubao, width: '700', height: '470', skin: 'blue', lock: true,
                background: '#666', opacity: .6, duration: 300, fixed: true, left: '50%',
                top: '38.2%', zIndex: 1987, resize: true, drag: true
            });
        }
        function Closejubao() {
            objjubao.close();
        }
    </script> 
<!--foot-->
<div class="bg_100 foot_nav_bg" style=" min-width:1200px;">
    <div class="foot_nav"> 
        
       <a href="https://www.bingdoc.com/h-33.html" target="_blank" >关于我们</a> - <a href="https://www.bingdoc.com/h-34.html"
            target="_blank" >网站声明</a> - <a href="https://www.bingdoc.com/h-35.html" target="_blank" >
                网站地图</a>  - <a href="https://www.bingdoc.com/sitemap.html" target="_blank" >
                资源地图</a> 
        - <a href="https://www.bingdoc.com/friend.aspx" target="_blank" >友情链接</a> -
        <a rel="nofollow"  target="_blank" href="https://wpa.qq.com/msgrd?v=3&uin=89258806&site=qq&menu=yes" >网站客服</a>
        
        - <a  rel="nofollow" href="https://www.bingdoc.com/h-38.html" target="_blank" >联系我们</a>
        
       </div>
</div>

<div class="bg_100 siteInner_bg" style=" min-width:1200px;">
    <div class="siteInner">
    <p style="text-align: center;">copyright@ 2008-2023 冰点文库 网站版权所有</p><p style="text-align: center;">经营许可证编号:<a href="http://beian.miit.gov.cn/" target="_blank">鄂ICP备19020893号-2</a></p><p><br/></p><script>var _hmt = _hmt || [];
(function() {
  var hm = document.createElement("script");
  hm.src = "https://hm.baidu.com/hm.js?0ad70f53e1865ffad028aaa274d1445e";
  var s = document.getElementsByTagName("script")[0]; 
  s.parentNode.insertBefore(hm, s);
})();</script>
           
    </div>
</div>
<!--foot end-->

 

<!-- 代码部分begin -->
<div class="QQ_S" style="height: auto;position:fixed;right: 0px;bottom: 20px; top:auto;">
  <div class="Q_top" onclick="HideFoot()"> <span class="signi"></span>收起</div>
  <div class="Q_botm">

    <div class="Q_pic">
      <div class="Q_pic_hide"> <a  rel="nofollow"  href="https://wpa.qq.com/msgrd?v=3&uin=89258806&site=qq&menu=yes" target="_blank" title="在线客服" ><span class="hide_pic"></span>在线客服</a> </div>
    </div>
      
    <div class="Q_anser">
      <div class="Q_anser_hide"><a  rel="nofollow"  target="_blank" href="https://mail.qq.com/cgi-bin/qm_share?t=qm_mailme&email=89258806@qq.com" title="意见反馈">
      <span class="hide_pic1"></span>意见反馈 </a> </div>
    </div>
    <div class="Q_sign">
      <div class="Q_sign_hide" onclick="backToTop();"><a  rel="nofollow"  href="javascript:void(0)" title="返回顶部"><span class="hide_pic2"></span>返回顶部 </a></div>
    </div>
  </div>
</div>
<div class="QQ_S1">
  <div class="Q_top1" onclick="ShowFoot()"> <span class="signj"></span>展开</div>
  <div class="Q_botm1">
    <div class="Q_pic1">
      <div class="Q_pic1_hide"> 
          <a rel="nofollow"  target="_blank" href="https://wpa.qq.com/msgrd?v=3&uin=89258806&site=qq&menu=yes" >
              <span class="hide_pic3"></span>QQ交谈</a></div>
    </div>
    <div class="Q_sign1">
      <div class="Q_sign1_hide" onclick="backToTop();"><a  rel="nofollow"  href="javascript:void(0)">返回顶部</a></div>
    </div>
  </div>
</div> 
<!-- 代码部分end -->
<script type="text/javascript" src="https://static.bingdoc.com/js/lanrenzhijia.js"></script>
 
<script  type="text/javascript" src="https://static.bingdoc.com/js/jquery.lazyload.js"></script>
<script type="text/javascript" charset="utf-8"> 
    $("img.lazys").lazyload({
        threshold: 200,
        effect: "fadeIn"
    });
</script>
<script  type="text/javascript" src="https://static.bingdoc.com/umeditor/xss.js"></script>
    
   

</body>
</html>