精通HTML5 + CSS3+JavaScript网页设计

精通HTML5 + CSS3+JavaScript网页设计

1　HTML5概述

1.1　HTML5的基本概念

1.1.1　HTML5简介

1.1.2　HTML5文件的基本结构

1.2　HTML5文件的编写方法

1.2.1　使用记事本手工编写HTML文件

1.2.2　使用Dreamweaver CS5.5编写HTML文件

1.3　使用浏览器查看HTML5文件

1.3.1　各大浏览器与HTML5的兼容

1.3.2　查看页面效果

1.3.3　查看源文件

1.4　专家解惑

2　HTML5网页文档结构

2.1　Web标准

2.1.1　Web标准概述

2.1.2　Web标准规定的内容

2.2　HTML基本标记

2.2.1　文档类型说明

2.2.2　HTML标记

2.2.3　头标记head

2.2.4　网页的主体标记body

2.2.5　页面注释标记

2.3　综合实例——符合W3C标准的HTML5网页

2.4　专家解惑

3　HTML5网页中的文本和图像

3.1　添加文本

3.1.1　普通文本

3.1.2　特殊文字符号

3.1.3　文本特殊样式

3.2　文本排版

3.2.1　换行标记
与段落标记

3.2.2　标题标记

～

3.3　文字列表

3.3.1　建立无序列表

3.3.2　建立有序列表

3.4　网页中的图像

3.4.1　网页中支持的图片格式

3.4.2　使用路径

3.4.3　网页中插入图像标记

3.5　综合实例——图文并茂房屋装饰装修网页

3.6　专家解惑

4　用HTML5建立超链接

4.1　URL的概念

4.1.1　URL的格式

4.1.2　URL的类型

4.2　超链接标记

4.2.1　设置文本和图片的超链接

4.2.2　超链接指向的目标类型

4.2.3　设置以新窗口显示超链接页面

4.3　创建热点区域

4.4　浮动框架iframe

4.5　综合实例——用Dreamweaver精确定位热点区域

4.6　专家解惑

5　用HTML5创建表格

5.1　表格基本结构及操作

5.1.1　表格基本结构

5.1.2　合并单元格

5.2　完整的表格标记

5.3　综合实例——制作计算机报价单

5.4　专家解惑

6　使用表单

6.1　表单概述

6.2　表单基本元素的使用

6.2.1　单行文本输入框text

6.2.2　多行文本框标记</h5> <h5 id="623-密码域password">6.2.3　密码域password</h5> <h5 id="624-单选按钮radio">6.2.4　单选按钮radio</h5> <h5 id="625-复选框checkbox">6.2.5　复选框checkbox</h5> <h5 id="626-选择列表标记">6.2.6　选择列表标记<select></h5> <h5 id="627-普通按钮button">6.2.7　普通按钮button</h5> <h5 id="628-提交按钮submit">6.2.8　提交按钮submit</h5> <h5 id="629-重置按钮reset">6.2.9　重置按钮reset</h5> <h4 id="63-表单高级元素的使用">6.3　表单高级元素的使用</h4> <h5 id="631-url属性">6.3.1　url属性</h5> <h5 id="632-eamil属性">6.3.2　eamil属性</h5> <h5 id="633-date和times">6.3.3　date和Times</h5> <h5 id="634-number属性">6.3.4　number属性</h5> <h5 id="635-range属性">6.3.5　range属性</h5> <h5 id="636-required属性">6.3.6　required属性</h5> <h4 id="64-综合实例创建用户反馈表单">6.4　综合实例——创建用户反馈表单</h4> <h4 id="65-专家解惑">6.5　专家解惑</h4> <h3 id="7-css3概述">7　CSS3概述</h3> <h4 id="71-css3介绍">7.1　CSS3介绍</h4> <h5 id="711-css3功能">7.1.1　CSS3功能</h5> <h5 id="712-css3发展历史">7.1.2　CSS3发展历史</h5> <h5 id="713-浏览器与css3">7.1.3　浏览器与CSS3</h5> <h4 id="72-编辑和浏览css">7.2　编辑和浏览CSS</h4> <h5 id="721-css基础语法">7.2.1　CSS基础语法</h5> <h5 id="722-使用记事本手工编写css文件">7.2.2　使用记事本手工编写CSS文件</h5> <h5 id="723-使用dreamweaver创建css文件">7.2.3　使用Dreamweaver创建CSS文件</h5> <h4 id="73-在html5中使用css3的方法">7.3　在HTML5中使用CSS3的方法</h4> <h5 id="731-行内样式">7.3.1　行内样式</h5> <h5 id="732-内嵌样式">7.3.2　内嵌样式</h5> <h5 id="733-链接样式">7.3.3　链接样式</h5> <h5 id="734-导入样式">7.3.4　导入样式</h5> <h5 id="735-优先级问题">7.3.5　优先级问题</h5> <h4 id="74-css3选择器">7.4　CSS3选择器</h4> <h5 id="741-标记选择器">7.4.1　标记选择器</h5> <h5 id="742-类选择器">7.4.2　类选择器</h5> <h5 id="743-id选择器">7.4.3　ID选择器</h5> <h5 id="744-全局选择器">7.4.4　全局选择器</h5> <h5 id="745-组合选择器">7.4.5　组合选择器</h5> <h5 id="746-继承选择器">7.4.6　继承选择器</h5> <h5 id="747-伪类">7.4.7　伪类</h5> <h5 id="748-属性选择器">7.4.8　属性选择器</h5> <h5 id="749-结构伪类选择器">7.4.9　结构伪类选择器</h5> <h5 id="7410-ui元素状态伪类选择器">7.4.10　UI元素状态伪类选择器</h5> <h4 id="75-选择器声明">7.5　选择器声明</h4> <h5 id="751-集体声明">7.5.1　集体声明</h5> <h5 id="752-多重嵌套声明">7.5.2　多重嵌套声明</h5> <h4 id="76-综合实例1制作五彩标题">7.6　综合实例1——制作五彩标题</h4> <h4 id="77-综合实例2制作新闻菜单">7.7　综合实例2——制作新闻菜单</h4> <h4 id="78-专家解惑">7.8　专家解惑</h4> <h3 id="8-css3字体与段落属性">8　CSS3字体与段落属性</h3> <h4 id="81-字体属性">8.1　字体属性</h4> <h5 id="811-字体font-family">8.1.1　字体font-family</h5> <h5 id="812-字号font-size">8.1.2　字号font-size</h5> <h5 id="813-字体风格font-style">8.1.3　字体风格font-style</h5> <h5 id="814-加粗字体font-weight">8.1.4　加粗字体font-weight</h5> <h5 id="815-小写字母转为大写字母font-variant">8.1.5　小写字母转为大写字母font-variant</h5> <h5 id="816-字体复合属性font">8.1.6　字体复合属性font</h5> <h5 id="817-字体颜色color">8.1.7　字体颜色color</h5> <h4 id="82-文本高级样式">8.2　文本高级样式</h4> <h5 id="821-阴影文本text-shadow">8.2.1　阴影文本text-shadow</h5> <h5 id="822-溢出文本text-overflow">8.2.2　溢出文本text-overflow</h5> <h5 id="823-控制换行word-wrap">8.2.3　控制换行word-wrap</h5> <h5 id="824-保持字体尺寸不变font-size-adjust">8.2.4　保持字体尺寸不变font-size-adjust</h5> <h4 id="83-段落属性">8.3　段落属性</h4> <h5 id="831-单词间隔word-spacing">8.3.1　单词间隔word-spacing</h5> <h5 id="832-字符间隔letter-spacing">8.3.2　字符间隔letter-spacing</h5> <h5 id="833-文字修饰text-decoration">8.3.3　文字修饰text-decoration</h5> <h5 id="834-垂直对齐方式vertial-align">8.3.4　垂直对齐方式vertial-align</h5> <h5 id="835-文本转换text-transform">8.3.5　文本转换text-transform</h5> <h5 id="836-水平对齐方式text-align">8.3.6　水平对齐方式text-align</h5> <h5 id="837-文本缩进text-indent">8.3.7　文本缩进text-indent</h5> <h5 id="838-文本行高line-height">8.3.8　文本行高line-height</h5> <h5 id="839-处理空白white-sapce">8.3.9　处理空白white-sapce</h5> <h5 id="8310-文本反排unicode-bidi和direction">8.3.10　文本反排unicode-bidi和direction</h5> <h4 id="84-综合实例1制作旅游宣传网页">8.4　综合实例1——制作旅游宣传网页</h4> <h4 id="85-综合实例2网页简单图文混排">8.5　综合实例2——网页简单图文混排</h4> <h4 id="86-专家解惑">8.6　专家解惑</h4> <h3 id="9-css3美化表格和表单样式">9　CSS3美化表格和表单样式</h3> <h4 id="91-表格基本样式">9.1　表格基本样式</h4> <h5 id="911-表格边框样式">9.1.1　表格边框样式</h5> <h5 id="912-表格边框宽度">9.1.2　表格边框宽度</h5> <h5 id="913-表格边框颜色">9.1.3　表格边框颜色</h5> <h4 id="92-css3与表单">9.2　CSS3与表单</h4> <h5 id="921-美化表单中元素">9.2.1　美化表单中元素</h5> <h5 id="922-美化提交按钮">9.2.2　美化提交按钮</h5> <h5 id="923-美化下拉菜单">9.2.3　美化下拉菜单</h5> <h4 id="93-综合实例1隔行变色">9.3　综合实例1——隔行变色</h4> <h4 id="94-综合实例2表格图文网页布局">9.4　综合实例2——表格图文网页布局</h4> <h4 id="95-综合实例3变色表格">9.5　综合实例3——变色表格</h4> <h4 id="96-综合实例4登录表单">9.6　综合实例4——登录表单</h4> <h4 id="97-综合实例5注册表单">9.7　综合实例5——注册表单</h4> <h4 id="98-专家解惑">9.8　专家解惑</h4> <h3 id="10-css3美化图像">10　CSS3美化图像</h3> <h4 id="101-图片样式">10.1　图片样式</h4> <h5 id="1011-图片边框">10.1.1　图片边框</h5> <h5 id="1012-图片缩放">10.1.2　图片缩放</h5> <h4 id="102-对齐图片">10.2　对齐图片</h4> <h5 id="1021-横向对齐方式">10.2.1　横向对齐方式</h5> <h5 id="1022-纵向对齐方式">10.2.2　纵向对齐方式</h5> <h4 id="103-图文混排">10.3　图文混排</h4> <h5 id="1031-文字环绕">10.3.1　文字环绕</h5> <h5 id="1032-设置图片与文字间距">10.3.2　设置图片与文字间距</h5> <h4 id="104-综合实例1一句话新闻">10.4　综合实例1——一句话新闻</h4> <h4 id="105-综合实例2学校宣传单">10.5　综合实例2——学校宣传单</h4> <h4 id="106-专家解惑">10.6　专家解惑</h4> <h3 id="11-css3美化背景与边框">11　CSS3美化背景与边框</h3> <h4 id="111-背景相关属性">11.1　背景相关属性</h4> <h5 id="1111-背景颜色">11.1.1　背景颜色</h5> <h5 id="1112-背景图片">11.1.2　背景图片</h5> <h5 id="1113-背景图片重复">11.1.3　背景图片重复</h5> <h5 id="1114-背景图片显示">11.1.4　背景图片显示</h5> <h5 id="1115-背景图片位置">11.1.5　背景图片位置</h5> <h5 id="1116-背景图片大小">11.1.6　背景图片大小</h5> <h5 id="1117-背景显示区域">11.1.7　背景显示区域</h5> <h5 id="1118-背景图像裁剪区域">11.1.8　背景图像裁剪区域</h5> <h5 id="1119-背景复合属性">11.1.9　背景复合属性</h5> <h4 id="112-边框">11.2　边框</h4> <h5 id="1121-边框样式">11.2.1　边框样式</h5> <h5 id="1122-边框颜色">11.2.2　边框颜色</h5> <h5 id="1123-边框线宽">11.2.3　边框线宽</h5> <h5 id="1124-边框复合属性">11.2.4　边框复合属性</h5> <h4 id="113-圆角边框">11.3　圆角边框</h4> <h5 id="1131-圆角边框属性">11.3.1　圆角边框属性</h5> <h5 id="1132-指定两个圆角半径">11.3.2　指定两个圆角半径</h5> <h5 id="1133-绘制四个不同圆角边框">11.3.3　绘制四个不同圆角边框</h5> <h5 id="1134-绘制边框种类">11.3.4　绘制边框种类</h5> <h4 id="114-图片边框">11.4　图片边框</h4> <h5 id="1141-图片边框属性">11.4.1　图片边框属性</h5> <h5 id="1142-设置图像边框显示方式">11.4.2　设置图像边框显示方式</h5> <h5 id="1143-图像边框重复性解析">11.4.3　图像边框重复性解析</h5> <h4 id="115-综合实例简单公司主页">11.5　综合实例——简单公司主页</h4> <h4 id="116-专家解惑">11.6　专家解惑</h4> <h3 id="12-javascript概述">12　JavaScript概述</h3> <h4 id="121-javascript简介">12.1　JavaScript简介</h4> <h5 id="1211-javascript是什么">12.1.1　JavaScript是什么</h5> <h5 id="1212-javascript和java的关系">12.1.2　JavaScript和Java的关系</h5> <h5 id="1213-javascript的发展历史">12.1.3　JavaScript的发展历史</h5> <h5 id="1214-javascript开发及运行环境">12.1.4　JavaScript开发及运行环境</h5> <h4 id="122-在html5文件中使用javascript代码">12.2　在HTML5文件中使用JavaScript代码</h4> <h5 id="1221-javascript嵌入html5文件">12.2.1　JavaScript嵌入HTML5文件</h5> <h5 id="1222-外部javascript文件">12.2.2　外部JavaScript文件</h5> <h4 id="123-综合实例欢迎光临网站的javascript程序">12.3　综合实例——欢迎光临网站的JavaScript程序</h4> <h4 id="124-专家解惑">12.4　专家解惑</h4> <h3 id="13-javascript语言基础">13　JavaScript语言基础</h3> <h4 id="131-数据类型与变量">13.1　数据类型与变量</h4> <h5 id="1311-数据类型">13.1.1　数据类型</h5> <h5 id="1312-变量">13.1.2　变量</h5> <h5 id="1313-保留关键字">13.1.3　保留关键字</h5> <h4 id="132-运算符与表达式">13.2　运算符与表达式</h4> <h5 id="1321-算术运算符及表达">13.2.1　算术运算符及表达</h5> <h5 id="1322-赋值运算符及其表达式">13.2.2　赋值运算符及其表达式</h5> <h5 id="1323-关系运算符及其表达式">13.2.3　关系运算符及其表达式</h5> <h5 id="1324-位运算符及其表达式">13.2.4　位运算符及其表达式</h5> <h5 id="1325-逻辑运算符与逻辑表达式">13.2.5　逻辑运算符与逻辑表达式</h5> <h5 id="1326-其他运算符及运算符优先级">13.2.6　其他运算符及运算符优先级</h5> <h4 id="133-流程控制语句">13.3　流程控制语句</h4> <h5 id="1331-注释语句和语句块">13.3.1　注释语句和语句块</h5> <h5 id="1332-选择语句">13.3.2　选择语句</h5> <h5 id="1333-循环语句">13.3.3　循环语句</h5> <h4 id="134-函数">13.4　函数</h4> <h5 id="1341-函数简介">13.4.1　函数简介</h5> <h5 id="1342-定义函数">13.4.2　定义函数</h5> <h5 id="1343-调用函数">13.4.3　调用函数</h5> <h5 id="1344-系统函数">13.4.4　系统函数</h5> <h4 id="135-综合实例购物简易计算器">13.5　综合实例——购物简易计算器</h4> <h4 id="136-专家解惑">13.6　专家解惑</h4> <h3 id="14-javascript内置对象">14　JavaScript内置对象</h3> <h4 id="141-字符串对象">14.1　字符串对象</h4> <h5 id="1411-字符串对象的创建">14.1.1　字符串对象的创建</h5> <h5 id="1412-字符串对象的常用属性">14.1.2　字符串对象的常用属性</h5> <h5 id="1413-字符串对象的常用函数">14.1.3　字符串对象的常用函数</h5> <h4 id="142-数学对象">14.2　数学对象</h4> <h5 id="1421-数学对象的属性">14.2.1　数学对象的属性</h5> <h5 id="1422-数学对象的函数">14.2.2　数学对象的函数</h5> <h4 id="143-日期对象">14.3　日期对象</h4> <h5 id="1431-创建日期对象">14.3.1　创建日期对象</h5> <h5 id="1432-日期对象的常用函数">14.3.2　日期对象的常用函数</h5> <h5 id="1433-日期间的运算">14.3.3　日期间的运算</h5> <h4 id="144-数组对象">14.4　数组对象</h4> <h5 id="1441-数组对象的创建">14.4.1　数组对象的创建</h5> <h5 id="1442-数组对象的操作">14.4.2　数组对象的操作</h5> <h5 id="1443-数组对象的常用方法">14.4.3　数组对象的常用方法</h5> <h4 id="145-综合实例随机验证码和动态时钟">14.5　综合实例——随机验证码和动态时钟</h4> <h4 id="146-专家解惑">14.6　专家解惑</h4> <h3 id="15-javascript对象编程">15　JavaScript对象编程</h3> <h4 id="151-文档对象模型（dom）">15.1　文档对象模型（DOM）</h4> <h5 id="1511-文档对象模型（dom）介绍">15.1.1　文档对象模型（DOM）介绍</h5> <h5 id="1512-在dom模型中获得对象的方法">15.1.2　在DOM模型中获得对象的方法</h5> <h5 id="1513-事件驱动">15.1.3　事件驱动</h5> <h4 id="152-窗口（window）对象">15.2　窗口（window）对象</h4> <h5 id="1521-窗口（window）介绍">15.2.1　窗口（window）介绍</h5> <h5 id="1522-对话框">15.2.2　对话框</h5> <h5 id="1523-窗口操作">15.2.3　窗口操作</h5> <h4 id="153-文档（document）对象">15.3　文档（document）对象</h4> <h5 id="1531-文档的属性">15.3.1　文档的属性</h5> <h5 id="1532-文档中的图片">15.3.2　文档中的图片</h5> <h5 id="1533-文档中的超链接">15.3.3　文档中的超链接</h5> <h4 id="154-表单对象">15.4　表单对象</h4> <h5 id="1541-form对象">15.4.1　form对象</h5> <h5 id="1542-form对象属性与方法">15.4.2　form对象属性与方法</h5> <h5 id="1543-单选与复选的使用">15.4.3　单选与复选的使用</h5> <h5 id="1544-下拉菜单使用">15.4.4　下拉菜单使用</h5> <h5 id="1545-案例：表单注册与表单验证">15.4.5　案例：表单注册与表单验证</h5> <h4 id="155-综合实例省市联动效果">15.5　综合实例——省市联动效果</h4> <h4 id="156-专家解惑">15.6　专家解惑</h4> <h3 id="16-javascript操纵css3">16　JavaScript操纵CSS3</h3> <h4 id="161-dhtml简介">16.1　DHTML简介</h4> <h4 id="162-前台动态网页效果">16.2　前台动态网页效果</h4> <h5 id="1621-动态内容">16.2.1　动态内容</h5> <h5 id="1622-动态样式">16.2.2　动态样式</h5> <h5 id="1623-动态定位">16.2.3　动态定位</h5> <h5 id="1624-显示与隐藏">16.2.4　显示与隐藏</h5> <h4 id="163-综合实例1js控制表单背景色和文字提示">16.3　综合实例1——JS控制表单背景色和文字提示</h4> <h4 id="164-综合实例2实现即时验证效果">16.4　综合实例2——实现即时验证效果</h4> <h4 id="165-专家解惑">16.5　专家解惑</h4> <h3 id="17-html5、css3和javascript">17　HTML5、CSS3和JavaScript</h3> <h4 id="171-综合实例1打字效果的文字">17.1　综合实例1——打字效果的文字</h4> <h4 id="172-综合实例2文字升降特效">17.2　综合实例2——文字升降特效</h4> <h4 id="173-综合实例3跑马灯效果">17.3　综合实例3——跑马灯效果</h4> <h4 id="174-综合实例4闪烁图片">17.4　综合实例4——闪烁图片</h4> <h4 id="175-综合实例5左右移动的图片">17.5　综合实例5——左右移动的图片</h4> <h4 id="176-综合实例6向上滚动菜单">17.6　综合实例6——向上滚动菜单</h4> <h4 id="177-综合实例7跟随鼠标移动的图片">17.7　综合实例7——跟随鼠标移动的图片</h4> <h4 id="178-综合实例8树形菜单">17.8　综合实例8——树形菜单</h4> <h4 id="179-综合实例9颜色选择器">17.9　综合实例9——颜色选择器</h4> <h4 id="1710-专家解惑">17.10　专家解惑</h4> <h3 id="18-html5绘制图形">18　HTML5绘制图形</h3> <h4 id="181-canvas概述">18.1　canvas概述</h4> <h5 id="1811-添加canvas元素">18.1.1　添加canvas元素</h5> <h5 id="1812-绘制矩形">18.1.2　绘制矩形</h5> <h4 id="182-绘制基本形状">18.2　绘制基本形状</h4> <h5 id="1821-绘制圆形">18.2.1　绘制圆形</h5> <h5 id="1822-使用moveto与lineto绘制直线">18.2.2　使用moveTo与lineTo绘制直线</h5> <h5 id="1823-使用beziercurveto绘制贝济埃曲线">18.2.3　使用bezierCurveTo绘制贝济埃曲线</h5> <h4 id="183-绘制渐变图形">18.3　绘制渐变图形</h4> <h5 id="1831-绘制线性渐变">18.3.1　绘制线性渐变</h5> <h5 id="1832-绘制径向渐变">18.3.2　绘制径向渐变</h5> <h4 id="184-绘制变形图形">18.4　绘制变形图形</h4> <h5 id="1841-变换原点坐标">18.4.1　变换原点坐标</h5> <h5 id="1842-图形缩放">18.4.2　图形缩放</h5> <h5 id="1843-旋转图形">18.4.3　旋转图形</h5> <h4 id="185-图形组合">18.5　图形组合</h4> <h4 id="186-绘制带阴影的图形">18.6　绘制带阴影的图形</h4> <h4 id="187-使用图像">18.7　使用图像</h4> <h5 id="1871-绘制图像">18.7.1　绘制图像</h5> <h5 id="1872-图像平铺">18.7.2　图像平铺</h5> <h5 id="1873-图像裁剪">18.7.3　图像裁剪</h5> <h5 id="1874-像素处理">18.7.4　像素处理</h5> <h4 id="188-绘制文字">18.8　绘制文字</h4> <h4 id="189-图形的保存与恢复">18.9　图形的保存与恢复</h4> <h5 id="1891-保存与恢复状态">18.9.1　保存与恢复状态</h5> <h5 id="1892-保存文件">18.9.2　保存文件</h5> <h5 id="1893-绘制图形综合应用">18.9.3　绘制图形综合应用</h5> <h4 id="1810-综合实例1绘制火柴棒人物">18.10　综合实例1—绘制火柴棒人物</h4> <h4 id="1811-综合实例2绘制时钟">18.11　综合实例2—绘制时钟</h4> <h4 id="1812-专家解惑">18.12　专家解惑</h4> <h3 id="19-html5中的音频和视频">19　HTML5中的音频和视频</h3> <h4 id="191-标记">19.1　<audio>标记</h4> <h5 id="1911-标记概述">19.1.1　<audio>标记概述</h5> <h5 id="1912-标记的属性">19.1.2　<audio>标记的属性</h5> <h5 id="1913-音频解码器">19.1.3　音频解码器</h5> <h5 id="1914-标记浏览器的支持情况">19.1.4　<audio>标记浏览器的支持情况</h5> <h4 id="192-标记">19.2　<video>标记</h4> <h5 id="1921-标记概述">19.2.1　<video>标记概述</h5> <h5 id="1922-标记的属性">19.2.2　<video>标记的属性</h5> <h5 id="1923-视频解码器">19.2.3　视频解码器</h5> <h5 id="1924-标记浏览器的支持情况">19.2.4　<video>标记浏览器的支持情况</h5> <h4 id="193-专家解惑">19.3　专家解惑</h4> <h3 id="20-地理定位、离线web应用和web存储">20　地理定位、离线Web应用和Web存储</h3> <h4 id="201-获取地理位置">20.1　获取地理位置</h4> <h5 id="2011-地理地位的原理">20.1.1　地理地位的原理</h5> <h5 id="2012-地理定位的函数">20.1.2　地理定位的函数</h5> <h5 id="2013-指定纬度和经度坐标">20.1.3　指定纬度和经度坐标</h5> <h5 id="2014-目前浏览器对地理定位的支持情况">20.1.4　目前浏览器对地理定位的支持情况</h5> <h4 id="202-html5离线web应用">20.2　HTML5离线web应用</h4> <h5 id="2021-新增的本地缓存">20.2.1　新增的本地缓存</h5> <h5 id="2022-本地缓存的管理者manifest文件">20.2.2　本地缓存的管理者——manifest文件</h5> <h5 id="2023-浏览器网页缓存与本地缓存的区别">20.2.3　浏览器网页缓存与本地缓存的区别</h5> <h5 id="2024-目前浏览器对web离线应用的支持情况">20.2.4　目前浏览器对Web离线应用的支持情况</h5> <h4 id="203-web存储">20.3　Web存储</h4> <h5 id="2031-本地存储和cookies的区别">20.3.1　本地存储和Cookies的区别</h5> <h5 id="2032-在客户端存储数据">20.3.2　在客户端存储数据</h5> <h5 id="2033-sessionstorage函数">20.3.3　sessionStorage函数</h5> <h5 id="2034-localstorage函数">20.3.4　localStorage函数</h5> <h5 id="2035-目前浏览器对web存储的支持情况">20.3.5　目前浏览器对Web存储的支持情况</h5> <h4 id="204-专家解惑">20.4　专家解惑</h4> <h3 id="21-企业门户网站的综合实战">21　企业门户网站的综合实战</h3> <h4 id="211-构思布局">21.1　构思布局</h4> <h5 id="2111-设计分析">21.1.1　设计分析</h5> <h5 id="2112-排版架构">21.1.2　排版架构</h5> <h4 id="212-模块分割">21.2　模块分割</h4> <h5 id="2121-logo与导航菜单">21.2.1　Logo与导航菜单</h5> <h5 id="2122-左侧文本介绍">21.2.2　左侧文本介绍</h5> <h5 id="2123-右侧导航链接">21.2.3　右侧导航链接</h5> <h5 id="2124-版权信息">21.2.4　版权信息</h5> <h4 id="213-整体调整">21.3　整体调整</h4> <h4 id="214-专家解惑">21.4　专家解惑</h4> <h3 id="思维导图">思维导图</h3> <p><img src="http://www.processon.com/chart_image/5e5b3859e4b0cb56dab11f05.png" alt="精通HTML5 + CSS3+JavaScript网页设计" loading="lazy"></p> <p>防止博客图床图片失效，防止图片源站外链：</p> <p><a href="http://www.processon.com/chart_image/5e5b3859e4b0cb56dab11f05.png" target="_blank">http://www.processon.com/chart_image/5e5b3859e4b0cb56dab11f05.png</a>)</p> <p>思维导图在线编辑链接：</p> <p><a href="https://www.processon.com/view/5e5b3859e4b0cb56dab11f02" target="_blank">https://www.processon.com/view/5e5b3859e4b0cb56dab11f02</a></p>