详解HTML内联标签iframe的使用

2022-08-31 0 709
2023.1.2
资源来源于互联网和网友投稿如有侵犯到你的知识产权请发送邮件我们将在72小时内请及时及时删除下架,客服QQ1506151422
本站提供的资源,都来自网络,版权争议与本站无关,所有内容及软件的文章仅限用于学习和研究目的。
不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负,我们不保证内容的长久可用性,通过使用本站内容随之而来的风险以及产生法律纠纷与本站无关,您必须在下载后的24个小时之内,从您的电脑/手机中彻底删除。
如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。

本站只提供资源,不提供技术支持,介意勿下!源码太多站长无法每款都进行测试请自行甄别,虚拟产品售出无退换,下载链接如有失效请及时

详解HTML内联标签iframe的使用

Iframe内联框架

iframe是HTML标签,它可以把一个网页的框架和内容,嵌入在现有的网页中,也就是说,我们可以在自己的网页中加载别人的网站,当然,iframe标签的一些属性也是我们在使用iframe时所需要了解的,帮助我们更好的使用它。

用法以及属性

用法:

在页面中直接使用iframe标签

1

<iframe src="" frameborder="0"></iframe>

属性:

  • src:引入页面的地址
  • framedorder:是否显示边框,属性值有yes和no,yes表示显示边框,no表示不显示
  • name:框架标识名
  • scrolling:是否出现滚动条,属性值有yes,no,auto。yes是显示滚动条,而no表示不显示滚动条。auto是自动适应窗口的大小。
  • width:定义iframe宽度,可以用px来调整,也可以用百分比%
  • hight:定义iframe高度,,可以用px来调整,也可以用百分比%
  • noresize:是否允许调整框架窗口的大小
  • algin:根据周围元素对齐的方式

接下来来看看它是如何使用的吧。

1.在页面直接使用嵌套

1

2

3

```html

  <iframe src="http://www.baidu.com" frameborder="0" width="60%" height="500px" scrolling="auto">

  </iframe>

详解HTML内联标签iframe的使用

如何快速入门VUE3.0:进入学习

2.与a标签结合使用

1

2

3

4

<p><a href="http://www.baidu.com" target="right-frame">百度</a></p>

  <p><a href="http://qq.com" target="right-frame">腾讯</a></p>

  <iframe src="http://qq.com"  name="right-frame" width="400px" height="300px">

  </iframe>

详解HTML内联标签iframe的使用

此时点百度这个超链接可以跳转页面

详解HTML内联标签iframe的使用

这两个页面可以实现简单的跳转了。

收藏 (0) 打赏

感谢您的支持,我会继续努力的!

打开/支付宝扫一扫,即可进行扫码打赏哦,分享从这里开始,精彩与您同在
点赞 (0)

网站部分资源上传至小程序供免费下载

百度小程序 小程序
 
常见问题

相关文章