HTML 框架

iframe通过使用框架，你可以在同一个浏览器窗口中显示不止一个页面。

如下，你所看到的页面里嵌入了Python-XP.com的首页

iframe语法:

该URL指向不同的网页。

属性sandbox用于设置安全选项

值	描述
""	启用所有限制条件
allow-same-origin	允许将内容作为普通来源对待。如果未使用该关键字，嵌入的内容将被视为一个独立的源。
allow-top-navigation	嵌入的页面的上下文可以导航（加载）内容到顶级的浏览上下文环境（browsing context）。如果未使用该关键字，这个操作将不可用。
allow-forms	允许表单提交。
allow-scripts	允许脚本执行。

 

---

Iframe - 宽高属性

height 和 width 属性用来定义iframe标签的高度与宽度。

属性默认以像素为单位, 但是你可以指定其按比例显示 (如："80%")。

<!-- 可以尝试修改网址、大小 -->
<iframe src="https://bilibili.com" width="200" height="200"></iframe>

 

---

Iframe - 边框属性

frameborder 属性用于定义iframe表示是否显示边框。

举例: 设置属性值为 "0" 移除iframe的边框:

<iframe src="https://bilibili.com" frameborder="0"></iframe>

 

---

iframe - name属性

iframe可以显示一个目标链接的页面

目标链接的属性必须使用属性，如下实例:

<iframe src="https://www.python-xp.com/article/29" name="iframe_a"></iframe>
<p>
<a href="https://www.python-xp.com/article/view/250" target="iframe_a">
    python-xp.com框架讲解页面
</a>
</p>

 

---

iframe - 滚动条

scrolling="auto|yes|no" 属性控制iframe滚动条，建议使用css overflow属性控制

<h2>有滚动条</h2>
<iframe src="https://www.python-xp.com/article/29"
 name="iframe_a"  heigth=100 width=100% scrolling=yes></iframe>
<br />
<br />
<br />
<br />
<h2>无滚动条</h2>
<iframe src="https://www.python-xp.com/article/29" 
 name="iframe_a"  heigth=100 width=100% scrolling=no></iframe>