HTML5不支持frameset的两种解决方法


Posted in HTML / CSS onNovember 14, 2016

解决方法如下:

第一种

使用iframe,但是目前使用iframe的人已经越来越少了,而且iframe在不同浏览器之间还有不兼容的情况。而且我一些研发的人员,他们表示iframe窗口间传值似乎很麻烦。

第二种

使用jQuery的onload方法加载页面,不过这种方法跳转多个页面后,点击浏览器上方的后退前进是无效的,不过可以认为的添加一个返回按钮。

所以个人更倾向于这种方法。

我一般是这样写的

$("#main").load("mainIndex.html",function(){

 });

对于页面,div+css可以实现frame的效果

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>div+css实现frameset效果</title>
<style type="text/css">
.header{border-bottom:1px solid #ccc;margin-bottom:5px;}
.MainContainer{min-width:960px;max-width:1600px;}
.sidebar{width:180px;float:left;margin-right:-180px;border-right:1px solid #ccc;min-height:500px;padding:5px;}
.main{float:left;margin-left:200px;padding:5px;}
.content{padding:0 10px;}
</style>
</head>
<body>
    <div class="page">
        <div class="header">
            <div id="title">
                <h1>顶部</h1>
            </div>
        </div>
        <div class="MainContainer">
            <div class="sidebar">
            边栏
            </div>
            <div  id="main" class="main">
                内容
            </div>           
        </div>
    </div>
</body>
</html>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

HTML / CSS 相关文章推荐
css3和jquery实现自定义checkbox和radiobox组件
Apr 22 HTML / CSS
纯CSS3实现的8种Loading动画效果
Jul 05 HTML / CSS
浅析css3中matrix函数的使用
Jun 06 HTML / CSS
canvas实现圆绘制的示例代码
Sep 11 HTML / CSS
用html5实现语音搜索框的方法
Mar 18 HTML / CSS
浅谈HTML5 服务器推送事件(Server-sent Events)
Aug 01 HTML / CSS
html5响应式开发自动计算fontSize的方法
Jan 13 HTML / CSS
CSS3 制作精美的定价表
Apr 06 HTML / CSS
CSS filter 有什么神奇用途
May 25 HTML / CSS
如何利用 CSS Overview 面板重构优化你的网站
Oct 24 HTML / CSS
Html5获取用户当前位置的几种方式
Jan 18 HTML / CSS
CSS元素定位之通过元素的标签或者元素的id、class属性定位详解
Sep 23 HTML / CSS
html5 视频播放解决方案
Nov 06 #HTML / CSS
HTML5头部标签的一些常用信息小结
Oct 23 #HTML / CSS
解决canvas转base64/jpeg时透明区域变成黑色背景的方法
Oct 23 #HTML / CSS
HTML5页面音视频在微信和app下自动播放的实现方法
Oct 20 #HTML / CSS
浅谈html5标签css3的常用样式
Oct 20 #HTML / CSS
html5中的一些标签学习(心得)
Oct 18 #HTML / CSS
HTML5+CSS3实现机器猫
Oct 17 #HTML / CSS
You might like
无数据库的详细域名查询程序PHP版(4)
2006/10/09 PHP
php ss7.5的数据调用 (笔记)
2010/03/08 PHP
php循环检测目录是否存在并创建(循环创建目录)
2011/01/06 PHP
php+ajax实现无刷新分页的方法
2014/11/04 PHP
PHP实现删除字符串中任何字符的函数
2015/08/11 PHP
使用PHP开发留言板功能
2019/11/19 PHP
jquery Ajax 实现加载数据前动画效果的示例代码
2014/02/07 Javascript
Bootstrap实现默认导航栏效果
2020/09/21 Javascript
微信小程序 火车票查询实例讲解
2016/10/17 Javascript
概述一个页面从输入URL到页面加载完的过程
2016/12/16 Javascript
jQuery插件echarts实现的循环生成图效果示例【附demo源码下载】
2017/03/04 Javascript
javascript数据结构中栈的应用之符号平衡问题
2017/04/11 Javascript
react.js CMS 删除功能的实现方法
2017/04/17 Javascript
angularjs之$timeout指令详解
2017/06/13 Javascript
vue-resource调用promise取数据方式详解
2017/07/21 Javascript
JS数组操作之增删改查的简单实现
2017/08/21 Javascript
使用MUI框架模拟手机端的下拉刷新和上拉加载功能
2017/09/04 Javascript
vue form 表单提交后刷新页面的方法
2018/09/04 Javascript
js使用formData实现批量上传
2020/03/27 Javascript
vue-form表单验证是否为空值的实例详解
2019/10/29 Javascript
Vue学习笔记之计算属性与侦听器用法
2019/12/07 Javascript
通过js随机函数Math.random实现乱序
2020/05/19 Javascript
VUE项目axios请求头更改Content-Type操作
2020/07/24 Javascript
python抓取京东价格分析京东商品价格走势
2014/01/09 Python
python实现类的静态变量用法实例
2015/05/08 Python
python matlibplot绘制多条曲线图
2021/02/19 Python
Python中的函数式编程:不可变的数据结构
2018/10/08 Python
python读取几个G的csv文件方法
2019/01/07 Python
python进程池实现的多进程文件夹copy器完整示例
2019/11/27 Python
python 变量初始化空列表的例子
2019/11/28 Python
python 中值滤波,椒盐去噪,图片增强实例
2019/12/18 Python
Python使用pymysql模块操作mysql增删改查实例分析
2019/12/19 Python
Django-migrate报错问题解决方案
2020/04/21 Python
css3实现文字首尾衔接跑马灯的示例代码
2020/10/16 HTML / CSS
实例教程 HTML5 Canvas 超炫酷烟花绽放动画实现代码
2014/11/05 HTML / CSS
求职简历中自我评价
2014/01/28 职场文书