1.在你的电脑里面找到这个路径
C:\Documents and Settings\Administrator\Local Settings\Temporary Internet Files
删除这个目录里面的东西；
2.用ie打开你想下载的网页；
3.回到这个路径下面并刷新
C:\Documents and Settings\Administrator\Local Settings\Temporary Internet Files
这时这个路径下面会出现你所要的页面的html源代码和css代码；
4.将这个里面的html，css，图片等都复制出来放到新建的文件夹里面；
5.将复制出来的文件的名字后面的“[1]”都删除，相关链接都改下就可以直接用了。
光html代码
实现不了复用，一般都是和一个
服务器端
程序一起使用才能达到你说的功能，这个时候html就是模板了，一个模板N个链接用，实现比较容易的是CMS，自己写的话，要懂的比较多。你找点国内的CMS试试吧！我用的是php的
typo3
CMS。
HTML复用，不需要任何模板就可以复用相同的内容
条件：控制页面布局显示就可以完成
示例：
主页
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8' />
<title>HTML调试</title>
<script type='text/javascript' src='js/jquery-1.8.0.min.js'></script>
<script src='js/zui.min.js' type='text/javascript' charset='utf-8'></script>
<script src='js/jquery-barcode.js' type='text/javascript' charset='utf-8'></script>
<link rel='stylesheet' type='text/css' href='css/zui.css' />
<style type='text/css'>
#container {
position: absolute
left: 0
top: 0
right: 0
bottom: 0
width: 100%
height: 100%
overflow: auto
font-family: '宋体'
}
</style>
</head>
<body>
<div id='container'>
<!--复用页面容器1-->
<div style="position: absoluteleft: 0pxtop: 0pxheight: 70pxwidth: 100%border-bottom: 1px solid #F1F1F1">
<iframe align="center" width="100%" height="70px" src="html/page_header.html" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
<div id="contents" style="position: absoluteleft: 0pxtop: 70pxwidth: 100px">
<!--不相同内容容器-->
</div>
<!--复用页面容器2-->
<div style="position: absoluteleft: 0pxtop: 585pxheight: 70pxwidth: 100%border-top: 1px solid #F1F1F1">
<iframe align="center" width="100%" height="70px" src="html/page_footer.html" frameborder="no" border="0" marginwidth="0" marginheight="0" scrolling="no"></iframe>
</div>
</div>
</body>
</html>
复用页面1
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="../js/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="../css/bootstrap.min.css" />
<title>复用头部</title>
</head>
<body>
<div style="position: absoluteleft: 0pxtop: 0pxheight: 70pxwidth:100%background: #ff0font-size: 30pxtext-align: centerline-height: 70px">
复用头部
</div>
</body>
</html>
复用页面2
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="../js/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>
<link rel="stylesheet" href="../css/bootstrap.min.css" />
<title>复用底部</title>
</head>
<body>
<div style="position: absoluteleft: 0pxtop: 0pxheight: 70pxwidth:100%background: #ff0font-size: 30pxtext-align: centerline-height: 70px">
复用底部
</div>
</body>
</html>
项目结构
实现结果：
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）