027_html框架

1. 通过使用框架, 你可以在同一个浏览器窗口中显示不止一个页面。每份html文档称为一个框架, 并且每个框架都独立于其他的框架。

2. <frameset>框架结构标签

2.1. <frameset>框架结构标签定义如何将窗口分割为框架。

2.2. 每个frameset定义了一系列行或列。您必须使用cols或rows属性。

2.3. rows/cols的值规定了每行或每列占据屏幕的面积。

2.4. 如果您希望验证某个包含框架的页面, 请确保DTD被设置为"Frameset DTD"。

2.5. 不能将<body></body>标签与<frameset></frameset>标签同时使用! 不过, 假如你添加包含一段文本的<noframes>标签, 就必须将这段文字嵌套于<body></body>标签内。

2.6. 可选属性

3. <frame>标签

3.1. <frame>标签定义frameset中的一个特定的窗口(框架)。

3.2. 可选属性

3.3. 在下面的这个例子中, 我们设置了一个两列的框架集。第一列被设置为占据浏览器窗口的25%。第二列被设置为占据浏览器窗口的75%。html文档"frame_a.htm"被置于第一个列中, 而html文档"frame_b.htm"被置于第二个列中:

<frameset cols="25%,75%"><frame src="frame_a.htm"><frame src="frame_b.htm">
</frameset>

3.4. 假如一个框架有可见边框, 用户可以拖动边框来改变它的大小。为了避免这种情况发生, 可以在<frame>标签中加入: noresize="noresize"。

4. <noframes>标签

4.1. noframes元素可为那些不支持框架的浏览器显示文本。noframes元素位于frameset元素内部。

4.2. 如果浏览器有能力处理框架, 就不会显示出noframes元素中的文本。

4.3. 如果您希望frameset添加<noframes>标签, 就必须把其中的文本包装在<body></body>标签中!

5. 垂直框架例子

5.1. frame_cols.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>垂直框架</title></head><frameset cols="25%,50%,25%"><frame src="../frame_a.html"><frame src="../frame_b.html"><frame src="../frame_c.html"></frameset>
</html>

5.2. frame_a.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta charset="utf-8" /><title>框架 A</title><style type="text/css">body{background-color: yellow;}</style></head><body>Frame A</body>
</html>

5.3. frame_b.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta charset="utf-8" /><title>框架 B</title><style type="text/css">body{background-color: gray;}</style></head><body>Frame B</body>
</html>

5.4. frame_c.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta charset="utf-8" /><title>框架 C</title><style type="text/css">body{background-color: green;}</style></head><body>Frame C</body>
</html>

5.5. 效果图

6. 水平框架例子

6.1. frame_rows.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>水平框架</title></head><frameset rows="25%,50%,25%"><frame src="../frame_a.html"><frame src="../frame_b.html"><frame src="../frame_c.html"></frameset>
</html>

6.2. 效果图

7. noframes例子

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>noframes标签</title></head><frameset cols="25%,50%,25%"><frame src="../frame_a.html"><frame src="../frame_b.html"><frame src="../frame_c.html"><noframes><body>您的浏览器无法处理框架!</body></noframes></frameset>
</html>

8. noresize属性例子

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>noresize属性</title></head><frameset cols="50%,*,25%"><frame src="../frame_a.html" noresize="noresize"><frame src="../frame_b.html"><frame src="../frame_c.html"></frameset>
</html>

9. 混合框架结构

9.1. 代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>混合框架结构</title></head><frameset rows="50%,50%"><frame src="../frame_a.html"><frameset cols="25%,75%"><frame src="../frame_b.html"><frame src="../frame_c.html"></frameset></frameset>
</html>

9.2. 效果图

10. 导航框架

10.1. nav.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>导航框架</title></head><frameset cols="120,*"><frame src="contents.html"><frame src="../frame_a.html" name="showFrame"></frameset>
</html>

10.2. contents.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta charset="utf-8" /><title>框架 contents</title></head><body><a href="../frame_a.html" target="showFrame">Frame A</a><a href="../frame_b.html" target="showFrame">Frame B</a><a href="../frame_c.html" target="showFrame">Frame C</a></body>
</html>

10.3. 效果图

11. target属性值是_parent和_top

11.1. nav.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>导航框架</title></head><frameset cols="120,*"><frame src="contents.html"><frame src="../frame_a.html" name="showFrame"></frameset>
</html>

11.2. contents.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><meta charset="utf-8" /><title>框架 contents</title></head><body><a href="../frame_a.html" target="showFrame">Frame A</a><a href="../frame_b.html" target="_parent">Frame B</a><a href="../frame_c.html" target="_top">Frame C</a></body>
</html>

11.3. multiple.html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
<html><head><meta charset="utf-8" /><title>target属性值是_parent和_top</title></head><frameset rows="50%,50%"><frame src="../frame_a.html"><frame src="nav.html"></frameset>
</html>

11.4. 效果图

027_html框架相关推荐

ssh(Struts+spring+Hibernate)三大框架整合-简述
ssh(Struts+spring+Hibernate)三大框架配合使用来开发项目,是目前javaee最流行的开发方式,必须掌握: 注意: 为了稳健起见,每加入一个框架,我们就需要测试一下,必须通过才 ...
Gin 框架学习笔记（03）— 输出响应与渲染
在 Gin 框架中,对 HTTP 请求可以很方便有多种不同形式的响应.比如响应为 JSON . XML 或者是 HTML 等. Context 的以下方法在 Gin 框架中把内容序列化为不同类型写 ...
Gin 框架学习笔记（02）— 参数自动绑定到结构体
参数绑定模型可以将请求体自动绑定到结构体中,目前支持绑定的请求类型有 JSON .XML .YAML 和标准表单 form数据 foo=bar&boo=baz 等.换句话说,只要定义好结构体, ...
QT学习之状态机框架
状态机框架创建状态机
【Spring】框架简介
[Spring]框架简介 Spring是什么 Spring是分层的Java SE/EE应用full-stack轻量级开源框架,以IOC(Inverse Of Control:反转控制)和AOP(Asp ...
开源自动化机器学习框架
20211101 在 Airbnb 使用机器学习预测房源的价格 https://blog.csdn.net/weixin_33735077/article/details/87976278?spm=1 ...
Keras框架下的保存模型和加载模型
在Keras框架下训练深度学习模型时,一般思路是在训练环境下训练出模型,然后拿训练好的模型(即保存模型相应信息的文件)到生产环境下去部署.在训练过程中我们可能会遇到以下情况: 需要运行很长时间的程序在 ...
Adam那么棒，为什么还对SGD念念不忘 (1) —— 一个框架看懂优化算法
机器学习界有一群炼丹师,他们每天的日常是: 拿来药材(数据),架起八卦炉(模型),点着六味真火(优化算法),就摇着蒲扇等着丹药出炉了. 不过,当过厨子的都知道,同样的食材,同样的菜谱,但火候不一样了, ...
一个框架看懂优化算法之异同 SGD/AdaGrad/Adam
Adam那么棒,为什么还对SGD念念不忘 (1) -- 一个框架看懂优化算法机器学习界有一群炼丹师,他们每天的日常是: 拿来药材(数据),架起八卦炉(模型),点着六味真火(优化算法),就摇着蒲扇等着 ...

027_html框架

027_html框架相关推荐

最新文章

热门文章