<a>标签与<iframe>标签关联应用
下面我将使用HTML中<a>标签target属性与<iframe>的name属性实现一个简单的实例:
实例
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div style="float:left;margin-right: 20px;"> <ul> <li><a href="https://www.baidu.com" target="jump">百度</a></li> <li><a href="https://www.4399.com" target="jump">4399</a></li> <li><a href="https://www.so.com" target="jump">搜狗</a></li> </ul> </div> <div style="float:left"> <iframe src="" srcdoc="跳转" frameborder="0" name="jump" width="800px" height="800px"></iframe> </div> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
上述代码中涉及知识点注释总结:
iframe会创建包含另外一个文档的内联框架。常见于网站后台的布局中。
<a>标签的target属性规定在任何处打开链接文档，使用target可以在一个<iframe>引用中打开该链接
利用<a>标签的target属性可以指向一个框架的name属性的特性，配合<iframe>标签的name属性，可以做到一个简陋的网站后台布局效果