Html5 引入了应用程序缓存，这意味着web应用可以进行缓存，并且可以在没有网络连接的时候进行访问。
我们在这里以一张图片的离线缓存为例进行演示；
在这里我们进行演示 主要分为四部走
第一步：manifest文件需要配置正确的MIME-type,即“text/cache-manifest”,必须在web服务器上进行配置
在这里我们以Tomcat为列进行演示
关于tomcat 我们可以再http://tomcat.apache.org/ 官网进行下载 直接下载到桌面就可以
对于tomcat我们需要一个java的环境 可以在这里下载http://www.oracle.com/technetwork/java/javase/downloads/index-jsp-138363.html
直接安装就可以 之后我们会进行java的环境变量的设置,具体教程我们可以再http://jingyan.baidu.com/article/e75aca85508d15142edac6b8.html这里进行查看
配置成功之后我们可以再浏览器地址栏中输入http://localhost:8080/进行查看 （默认的是8080端口）
接下来我们在tomcat安装目录下找啊conf/web.xml添加一个mime_type,可以添加到任意位置，当然，在mime-mapping其他标签附近易于管理维护
将这这一段代码
<mime-mapping>
<extension>manifest</extension>
<mime-type>text/cache-manifest</mime-type>
</mine-mapping>
（这一段代码可以让我们的.manifest文件可以被服务器识别）
第二步;
我们需要编写.manifest文件
我们需要在tomcat/webapp文件下创建一个文件夹放我们的manifest文件和html文件（在这里我们创建一个my命名的文件）
我们在my文件夹下创建一个manifest文件，在这里我们创建一个cc.manifest文件
在这里我创建了三个文件
我们先在cc.manifest里进行编辑
CACHE MANIFEST//声明头文件头部（大写）
CACHE:
images/1.jpg//离线存储文件（在这里我已一张图片为例）
然后我们在html文件里添加一张图片（图片放在images文件夹里）
第三步：
编写离线缓存的html文件
<!doctype html>
<html lang="en" manifest = "cc.manifest">
到此为止我们就做好了一张图片的离线缓存
看一下我们的服务器是否打开
打开后在浏览器地址中输入http://localhost:8080/my/index.html
如果服务器关闭我们就会看到无法访问的提示
反之会看浏览器中有一张图片（这是浏览器就会把图片保存在本地）
然后我们可以把服务器关闭
点击浏览器进行刷新；我们仍让能够看到图片
如果按照以上步骤进行之后图片依旧没有加载出来，可能有两个原因:
1.服务器端口号被占用（tomcat的默认端口是8080）我们可以进行修改 打开tomcat/conf/server.xml文件进行修改我是将8080改为8082
2.浏览器版本比较低；（可以通过下载高版本的浏览器来解决）
这时我们的离线缓存的小案例就做完了，希望可以一点带面使你对离线缓存技术有一个初步的了解