zccst
- 浏览: 3319206 次
- 性别:
- 来自: 北京
-
文章分类
- 全部博客 (567)
- Web前端-html/表单 (19)
- Web前端-CSS (24)
- Web前端-CSS框架 (4)
- Web前端-JS语言核心 (50)
- Web前端-JS客户端 (26)
- nodejs生态+grunt (10)
- seajs和requirejs (9)
- backbone等框架 (7)
- 模板基础 (7)
- Web前端-deps(不改动) (6)
- Web前端-component (10)
- Web前端-jquery-plugin (13)
- 浏览器兼容性 (6)
- Web前端-使用jQuery (25)
- Web前端-使用jqueryui (6)
- Web前端-性能优化 (3)
- Web协议-HTTP (6)
- ExtJS (13)
- PHP (22)
- PHP面向对象 (4)
- PHP扩展-SOAP (6)
- PHP扩展-curl (4)
- PHP与HTML(导出) (5)
- PHP扩展-综合 (7)
- mysql基础应用 (18)
- 技术心情 (18)
- 算法和面试题 (17)
- 工具（开发）使用 (36)
- memcached原理 (2)
- session和cookie (4)
- UML (2)
- Web前端_FusionCharts (5)
- Web前端_Flex (4)
- Web前端_JSP (3)
- JavaSE (10)
- JavaEE (4)
- tomcat (2)
- Servlet开发 (3)
- Spring开发 (1)
- REST相关 (2)
- 大访问量、高并发 (2)
- 网络编程 (1)
- YII (21)
- linux命令和内核 (12)
- yii与数据库 (10)
- yii与表单 (12)
- yii view层 (1)
- perl (7)
- yii扩展 (7)
- shell (4)
- photoshop (7)
- 视觉设计 (2)
- 我关注的名人在路上 (4)
- 1-自学能力 (1)
- 2-人际沟通能力 (3)
- 3-职业规划能力 (7)
- 4-项目管理能力 (2)
- python (3)
- django (4)
- Mysql高级应用 (6)
- prototype.js (4)
- Web系统安全 (1)
- Web前端-mobile (2)
- egret (6)
- jQuery源码分析 (5)
- fis (4)
最新评论
-
yzq21056563：
感谢作者分享~请教下，http://www.lisa33xia ...
CSS基础：text-overflow:ellipsis溢出文本 -
u012206458：
$.ajax的error,complete,success方法 -
DEMONU：
谢谢，虽然不能给你赞助，但是要给你顶
mysql中key 、primary key 、unique key 与index区别 -
njupt_tolmes：
阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿凡达阿滕庆亚 ...
CSS基础：text-overflow:ellipsis溢出文本 -
zenmshuo：
用过SpreadJS，也包含数据可视化的图表
推荐几个web中常用js图表插件
zccst转载
原文：
这是使用frameset做的，在宽屏下开发一直没有发现什么问题，直到一个用户使用800*600的机子测试的时候，才发现整个界面都被变形了。
那时整个frameset页面只有600像素高度，frameset嵌套的frame出现了滚动条，实在难看。怎么把frameset的高度设置高点，让其嵌套的frame页面没有滚动条，而让frameset有滚动条呢？
frameset的高度是设置不了的，比如：<frameset rows="110,*" style="height: 1900px;">。这时的页面还是屏幕的高度，并不是1900px；设置frameset的body的高度也无效。怎么办呢？我baidu了好多天，都没找到答案，这个问题就一直搁置着。也想到叫美工用DIV+CSS替换了frameset，但怕牵涉的内容太多，换的工作量也许很大，只好作罢。
灵感这东西真是怪，要来不来，来了挡也挡不住。就在这个问题放了一个来月后，今天它突然来了，来的时候还带着iframe。当我把frameset嵌套其中，并设置iframse页面的高度，效果果然出来了。现把解决方案与遇到相同问题而解决不了的同仁分享。
1、frameset页面(inner.html)
<html>
<frameset rows="110,*" frameborder="no" border="0" framespacing="-4px">
<frame src="header.jsp" name="topFrame" scrolling="no" noresize="noresize" />
<frameset cols="170,12,*" framespacing="0" frameborder="no" border="0" id="mainFrameset">
<frame src="left.jsp" name="leftFrame"scrolling="auto" noresize="noresize" id="leftFrame"/>
<frame src="narrow.jsp" scrolling="no" noresize="noresize"/>
<frame src="" name="mainFrame" noresize="noresize" />
</frameset>
</frameset>
<noframes>
</noframes>
</html>
2、iframe页面(outer.html)
关键是设置这个页面的高度，想要多高就设置多高，随你。这时里面包含的frameset也会是这个高度。
<body style="margin: 0px;height: 580px;width:960px;">
<iframe src="inner.html"
style="height:100%;width:100%;border-width: 0px;">
</iframe>
</body>
如果您觉得本文的内容对您的学习有所帮助，您可以微信：
原文：
这是使用frameset做的，在宽屏下开发一直没有发现什么问题，直到一个用户使用800*600的机子测试的时候，才发现整个界面都被变形了。
那时整个frameset页面只有600像素高度，frameset嵌套的frame出现了滚动条，实在难看。怎么把frameset的高度设置高点，让其嵌套的frame页面没有滚动条，而让frameset有滚动条呢？
frameset的高度是设置不了的，比如：<frameset rows="110,*" style="height: 1900px;">。这时的页面还是屏幕的高度，并不是1900px；设置frameset的body的高度也无效。怎么办呢？我baidu了好多天，都没找到答案，这个问题就一直搁置着。也想到叫美工用DIV+CSS替换了frameset，但怕牵涉的内容太多，换的工作量也许很大，只好作罢。
灵感这东西真是怪，要来不来，来了挡也挡不住。就在这个问题放了一个来月后，今天它突然来了，来的时候还带着iframe。当我把frameset嵌套其中，并设置iframse页面的高度，效果果然出来了。现把解决方案与遇到相同问题而解决不了的同仁分享。
1、frameset页面(inner.html)
<html>
<frameset rows="110,*" frameborder="no" border="0" framespacing="-4px">
<frame src="header.jsp" name="topFrame" scrolling="no" noresize="noresize" />
<frameset cols="170,12,*" framespacing="0" frameborder="no" border="0" id="mainFrameset">
<frame src="left.jsp" name="leftFrame"scrolling="auto" noresize="noresize" id="leftFrame"/>
<frame src="narrow.jsp" scrolling="no" noresize="noresize"/>
<frame src="" name="mainFrame" noresize="noresize" />
</frameset>
</frameset>
<noframes>
</noframes>
</html>
2、iframe页面(outer.html)
关键是设置这个页面的高度，想要多高就设置多高，随你。这时里面包含的frameset也会是这个高度。
<body style="margin: 0px;height: 580px;width:960px;">
<iframe src="inner.html"
style="height:100%;width:100%;border-width: 0px;">
</iframe>
</body>
如果您觉得本文的内容对您的学习有所帮助，您可以微信：
分享到：
发表评论
-
[html5]localStorage代替Cookie? HTML5本地存储安全性
2015-03-20 17:53 26374zccst转载 HTML5本地存储的前身就是Cookie，H ... -
[移动端]专用的meta
2015-03-04 15:31 8271作者：zccst <meta name=" ... -
[html5]触摸事件(touchstart、touchmove和touchend)
2015-02-13 20:28 29568作者：zccst 参考文章 ... -
meta name=viewport含义
2015-02-12 16:29 4038作者：zccst viewport中文 ... -
doctype和compatModel相关
2015-01-04 19:30 711作者：zccst 一、doctype 1，严格模式与混杂模 ... -
【转义字符】HTML 字符实体 < >: &等
2014-11-18 18:56 22967作者：zccst 2014-12-10 又 ... -
挖掘input type=file的新知识
2014-11-13 18:23 3102作者：zccst 文件上传，这个问题始终一知半解，今天又近真 ... -
div+css布局总结
2014-09-04 10:48 1425作者：zccst 3，position布局 #wrap ... -
文件上传的两种情况及mock时对应处理办法
2014-09-02 19:46 1710作者：zccst 1，给文件一个独立的url，要求文件上传至 ... -
attr与prop的区别
2014-07-09 18:20 964作者：zccst jQuery在1.6.1 ... -
HTML <label> 标签的 for 属性
2014-07-04 17:14 2048作者：zccst for 属性规定 label 与哪个表单元 ... -
天气接口API
2012-02-02 17:32 1343把下面代码粘贴到自己的页面里，就能显示天气了。 <if ... -
form表单深入理解
2011-11-23 20:12 2170作者：zccst form表单 一、表单基础 作用：用来向服 ... -
表单之input file的使用特点及在php.ini中的相关参数设置
2011-11-23 20:08 23371，控件 <input type= "fi ... -
文件编码
2011-07-04 18:35 1219今天第一次留意文件的编码格式。 改变方式：另存为时，可选择 ... -
html5新知识点
2011-05-12 22:53 1861作者：zccst 新技术 http://timelineap ... -
HTML 和 XHTML 区别
2011-05-12 22:24 1067这篇文章主要阐述 HTML 和 XHTML 的区别。简单来说， ... -
表单与ajax一并使用
2011-04-22 13:35 1191表单与ajax一并使用 一、表单需要注意的地方。 form ...
相关推荐
具体做法是创建一个包含iframe的页面，通过设置iframe的style属性中的height为想要的高度，这样整个页面的高度就被固定下来，从而避免了原frameset页面在不同分辨率下的变形问题。示例代码如下： ;width:100%;...
它们接受一系列值，以逗号分隔，表示每一列或每一行的宽度或高度。这些值可以是像素值（如“200”）、百分比（如“20%”）或星号（如“*”），其中星号代表剩余空间。 例如，`cols="20%,400,*"`意味着第一列占...
本篇将深入探讨如何利用Frameset进行页面布局设置。 一、Frameset基本概念 Frameset是HTML4的一个元素，用于创建多窗格布局，每个窗格可以独立加载不同的网页内容。在HTML5中，虽然不推荐使用frameset，但许多现有...
* `MARGINHEIGHT`：用于定义框架的高度边缘所保留的空间，以像素为单位。 使用 Frameset 可以实现多种复杂的网页布局，例如创建多个框窗，每个框窗显示不同的内容，或者创建一个框窗，框窗中包含多个小框窗，每个小...
例如，`rows="*, 3*"`表示第一个框架占窗口高度的1/4，第二个框架占剩下的3/4。 ```html <frameset rows="*, 3*"> </frameset> ``` ##### 4. Frame 标签 `<frame>`标签用于指定框架的具体内容来源。每个框架...
例如，在给出的部分内容中，可以看到一个嵌套的frameset结构，通过`rows`和`cols`属性来定义框架的高度和宽度分配。 ### 在frameset中应用背景图片的方法 为了在frameset中的各个框架内分别设置不同的背景图片，...
- `marginwidth` 和 `marginheight`：设置框架边距的宽度和高度。 3. **noframes 内容**： 当浏览器不支持框架或用户选择不显示框架时，`<noframes>` 标签内的内容将被显示。这对于保持网页的可用性至关重要。 4...
要实现边框不可调整大小，我们需要在`frameset`中的`frame`标签内添加`noresize`属性，并将其值设置为`noresize`。这将禁止用户通过拖拽的方式改变框架的大小。例如： ```html <frameset rows="12%,*" frameborder=...
在这个例子中，页面被分为三部分：顶部（header）、中间（content）和底部（footer），通过`rows`属性定义了各部分的高度。每个`<frame>`元素都指定了相应的源文件，使得头、主要内容和底部可以分别从不同的HTML文件...
在`leftMenu.jsp`中，我们可以设置链接的`onclick`事件来改变`rightFrame`的内容： ```jsp 商品1 ``` 这样，当用户点击左侧的商品链接时，右侧的内容会自动更新为对应的商品详情。 ### 4. 考虑现代浏览器兼容性 ...
这段代码会在页面加载完成后运行，通过获取当前页面的实际高度（`scrollHeight`）来动态设置框架的高度，从而确保框架能够完整展示其内容而无需额外的滚动。 3. **在子页面中引用脚本**：在每个需要调用的子页面中...
### ASP.NET中Frameset框架集嵌套的用法详解 #### 概述 在ASP.NET中，`frameset`框架集是一种将一个浏览器窗口分割成多个独立区域的技术，每个区域都可以独立显示不同的网页内容。这种技术特别适用于创建复杂的...
* rows：用于定义框架的行数和高度，例如rows="60,*"表示页面分为上下两个部分，其中上部分高度为60像素，下部分高度自适应。 * cols：用于定义框架的列数和宽度，例如cols="150,*"表示页面分为左右两个部分，其中左...
总的来说，通过使用JavaScript动态计算`<iframe>`内容的高度并设置`<iframe>`的高度，可以有效地解决`<iframe>`内容高度自适应以及设置高度后无法缩小的问题。同时，要注意兼容性问题和跨域限制，以确保在各种环境下...
这行代码创建了一个两行的布局，第一行占据10%的高度，第二行占据剩余的空间。 2. **rows和cols属性** - `rows`属性用于定义垂直分割的框架，值可以是百分比、像素值或星号(*)，星号表示剩余空间。 - `cols`属性...
2.页面代码不能高度重用，但是可以使用服务器动态语言里的include等语句实现。 DIV布局方式可以完全弥补掉Frameset布局的一些局限和缺点，并且也可以使用其他手段完成Frameset布局的优点，且实现难度较小。因此，在...
- **rows**: 定义了按行划分的高度。 例如： ```html <frameset cols="40%,60%"> </frameset> ``` 上面的例子中，页面被分为两列，左侧占40%，右侧占60%。每一列中的内容分别从`red.htm`和`green.htm`加载。 ...
此外，还可以设置其他属性，如`name`（为框架提供一个名称，便于通过JavaScript或超链接进行引用）和`noresize`（禁止用户调整框架大小）等。 HTML框架的一个常见应用是创建上下结构或者左右结构的布局。例如，我们...
- `width` 和 `height`：设置框架宽度和高度，单位通常是像素。 - `marginwidth` 和 `marginheight`：设置内容与框架边缘之间的距离。 - `frameborder`：是否显示边框，接受值为 `1` 或 `0`，等同于 `yes` 或 `no...
例如，`<frameset rows="50%, 50%">`将页面分为两个相等高度的区域。 2. `<frame>`：每个`<frame>`元素代表一个独立的网页区域。通过`src`属性，我们可以指定该框架要加载的网页URL。例如，`...