IT培训网 - IT职场人学IT技术上IT培训网
HTML框架是一类什么样的技术
时间:2016-12-05 11:35:07 来源:web前端培训网 作者:IT培训网 已有:名学员访问该课程
框架是什么呢,这个技术对网页有什么作用呢,如何使用html框架技术呢,对于h5框架来说,它是一类有助于快速快速轻松创建响应式网站的程序包。这些HTML5框架有着能减轻编程任务和重复代码负担的神奇功能。关于免费的HTML5框架,种类繁多,并且大多很受欢迎,因为它们能够允许我们用更少的时间和精力去创建一个令人惊艳的网站。下面就让我们一起来学习下这个技术吧!
HTML 框架
通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面。
HTML iframe 标签
标签 |
说明 |
<iframe> |
定义一个内联的iframe |
iframe语法:
<iframe src="URL"></iframe>
该URL指向不同的网页。
Iframe - 设置高度与宽度
height 和 width 属性用来定义iframe标签的高度与宽度。
属性默认以像素为单位, 但是你可以指定其按比例显示 (如:"80%").
实例
<iframe src=" http://www.itpxw.cn/qianduan/" width="200" height="200"></iframe>
源代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>IT培训网(www.itpxw.cn)</title>
</head>
<body>
<iframe src="http://www.itpxw.cn/qianduan/" width="500" height="200"></iframe>
<p>一些旧的浏览器不支持 iframe。</p>
<p>如果浏览器不支持 iframes 则不会显示。</p>
</body>
</html>
运行结果:
一些旧的浏览器不支持 iframe。
如果浏览器不支持 iframes 则不会显示。
Iframe - 移除边框
frameborder 属性用于定义iframe表示是否显示边框。
设置属性值为 "0" 移除iframe的边框:
实例
<iframe src="demo_iframe.htm" frameborder="0"></iframe>
源代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>IT培训网(www.itpxw.cn)</title>
</head>
<body>
<iframe src="http://www.itpxw.cn/qianduan/" width="500" height="200" frameborder="0">
<p>您的浏览器不支持 iframe 标签。</p>
</iframe>
</body>
</html>
运行结果:
使用iframe来显示目录链接页面
iframe可以显示一个目标链接的页面
目标链接的属性必须使用iframe的属性,如下实例:
实例
<iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="http://www.www.itpxw.cn" target="iframe_a">WWW.itpxw.cn</a></p>
源代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>IT培训网(www.itpxw.cn)</title>
</head>
<body>
<iframe src="http://www.itpxw.cn/" name="iframe_a"></iframe>
<p><a href=http://www.itpxw.cn/" target="iframe_a">http://www.itpxw.cn</a></p>
<p><b>注意:</b> 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架,所以在点击链接时页面会显示在 iframe框架中。</p>
</body>
</html>
运行结果:
注意: 因为 a 标签的 target 属性是名为 iframe_a 的 iframe 框架,所以在点击链接时页面会显示在 iframe框架中。
- 上一篇:如何制作html表单
- 下一篇:如何使用html颜色值