当前位置： 首页 > news >正文

HTML 框架

news 2026/2/9 23:59:11

HTML 框架

<iframe>标签规定一个内联框架。

　一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。

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

　iframe 语法：

<iframe src="URL"></iframe>

　该URL指向不同的网页，将窗口内容显示为URL地址指向页面。

 

Iframe - 设置高度与宽度

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

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

实例

<iframe src="demo_iframe.htm" width="80%" height="80%"></iframe>

尝试一下 »
 

Iframe - 移除边框

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

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

实例

<iframe src="demo_iframe.htm" frameborder="0"></iframe>

尝试一下 »
 

使用 iframe 来显示目录链接页面

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

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

实例

<iframe src="demo_iframe.htm" name="iframe_a"></iframe>
<p><a href="http://www.w3cschool.cn" target="iframe_a">W3CSCHOOL.CN</a></p>

尝试一下 »
 

HTML iframe 标签

标签说明
<iframe>定义一个内联的 iframe
 

iframe 标准属性

属性说明
class 规定元素的类名（classname）
id规定元素的唯一 id
style规定元素的行内样式（inline style）
title规定元素的额外信息（可在工具提示中显示）

HTML <frameset>标签 - HTML5 不支持

<frameset>标签在一个页面中设置一个或多个框架，用<frameset></frameset>代替了<body></body>，不能出现在body标签里。

　<frameset> 语法：

<frameset>

<frame src="menu.html">

<frame src="content.html">

</frameset>

  • frameset- 建立框架的标记，将在其中定义各个框架。
  • frame src- 指示框架显示内容URL地址。
 

<frameset> - 设置行列比例

<frameset>标签中我们使用rows设置行的占页面的百分比；cols设置列的所占百分比。

实例

<frameset rows="20%,*">

<frame src="title.html">

<frameset cols="30%,*">

<frame src="menu.html">

<frame src="content.html">

</frameset>

</frameset>


尝试一下 »
  • frameset cols- 确定每个框架列所占百分比。在前面的示例中，我们已经确定第一框架将占据所示区域的 30％，并且我们使用“*”符号来指示剩余百分比。
  • frameset rows- 确定将显示的每个框架行所占百分比。在前面的示例中，我们选择第一框架为 20％，剩下的剩余空间将在menu.html和content.html之间划分。
 

<frameset> - 设置边框 

　框架有一些边框线，大多数时候都不需要。<frameset>标签中我们使用frameborder和framespacing属性可以擦除它们。

注意：frameset和frameborder是相同的属性。

实例

<frameset border="0" frameborder="0" framespacing="0" rows="20%,*">

<frame src="title.html">

<frameset border="0" frameborder="0" framespacing="0" cols="30%,*">

<frame src="menu.html">

<frame src="content.html">

</frameset>

</frameset>


尝试一下 »
  • frameborder-设置边框， 0 值表示没有边框
  • border- 修改边框的粗细（由 Netscape 浏览器使用）
  • framespacing- 修改边框的粗细（由 Internet Explorer 浏览器使用）
 

<frame> - 设置名字 - HTML5 不支持 

<frame>标签中我们使用name属性命名每个框架，而不是内容页面。

实例

<frameset rows="20%,*">

<frame name="title" src="title.html">

<frameset cols="30%,*">

<frame name="menu" src="menu.html">

<name="content" src="content.html">

</frameset>

</frameset>


尝试一下 »

<frame> - 设置滚动

<frame>标签中我们使用noresize设置禁止用户拖拉框架大小；scrolling用于设置滚动条是否显示。

实例

<frameset border="2" frameborder="1" framespacing="2" rows="20%,*">

<frame src="title.html" noresize scrolling="no">

<frameset border="4" frameborder="1" framespacing="4" cols="30%,*">

<frame src="menu.html" scrolling="auto" noresize>

<frame src="content.html" scrolling="yes" noresize>

</frameset>

</frameset>


尝试一下 »
  • noresize- 不允许用户更改其尺寸。
  • scrolling- 设置滚动条是否显示。

相关文章：

HTML 框架

HTML 框架 <iframe>标签规定一个内联框架。 一个内联框架被用来在当前 HTML 文档中嵌入另一个文档。 通过使用框架&#xff0c;你可以在同一个浏览器窗口中显示不止一个页面。 iframe 语法&#xff1a; <iframe src"URL"></iframe> 该URL指向不同的…...

编程日记 2023/5/15 13:20:48

Rust特征(Trait)

特征(Trait) 特征&#xff08;trait&#xff09;是rust中的概念&#xff0c;类似于其他语言中的接口&#xff08;interface&#xff09;。在之前的代码中&#xff0c;我们也多次见过特征的使用&#xff0c;例如 #[derive(Debug)]&#xff0c;它在我们定义的类型(struct)上自动…...

编程日记 2023/5/15 13:20:33

详解七大排序算法

对于排序算法&#xff0c;是我们在数据结构阶段&#xff0c;必须要牢牢掌握的一门知识体系&#xff0c;但是&#xff0c;对于排序算法&#xff0c;里面涉及到的思路&#xff0c;代码……各种时间复杂度等&#xff0c;都需要我们&#xff0c;记在脑袋瓜里面&#xff01;&#xf…...

编程日记 2023/5/15 13:20:18

Vue+ECharts实现可视化大屏

由于项目需要一个数据大屏页面&#xff0c;所以今天学习了vue结合echarts的图标绘制 首先需要安装ECharts npm install echarts --save因为只是在数据大屏页面绘制图表&#xff0c;所以我们无需把它设置为全局变量。 可以直接在该页面引入echarts&#xff0c;就可以在数据大…...

编程日记 2023/5/15 13:20:01

百度Apollo规划算法——轨迹拼接

百度Apollo规划算法——轨迹拼接引言轨迹拼接1、什么是轨迹拼接&#xff1f;2、为什么要进行轨迹拼接&#xff1f;3、结合Apollo代码为例理解轨迹拼接的细节。参考引言 在apollo的规划算法中&#xff0c;在每一帧规划开始时会调用一个轨迹拼接函数&#xff0c;返回一段拼接轨迹…...

编程日记 2023/5/15 13:19:41

6. unity之脚本

1. 说明 当整个游戏运行起来之后&#xff0c;我们无法再借助鼠标来控制物体&#xff0c;此时可以使用脚本来更改物体的各种姿态&#xff0c;驱动游戏的整体运动逻辑。 2. 脚本添加 首先在Assets目录中&#xff0c;新创建一个Scripts文件夹&#xff0c;在该文件内右键鼠标选择…...

编程日记 2023/5/23 8:02:52

flink-note笔记：flink-state模块中broadcast state（广播状态）解析

github开源项目flink-note的笔记。本博客的实现代码都写在项目的flink-state/src/main/java/state/operator/BroadcastStateDemo.java文件中。 项目github地址： github 1. 广播状态是什么 网上关于flink广播变量、广播状态的讲解很杂。我翻了flink官网发现，实际上在1.15里面…...

编程日记 2023/5/23 8:02:48

vue——预览PDF

下载插件 npm install --save vue-pdf创建组件 <template><div class"ins-submit-docs-content ins-submit-docs-pdf"><div v-if"loading" style"position: absolute; top: 40%; width: 100%;text-align: center;"><el-l…...

编程日记 2023/5/23 8:02:45

数据库复习

什么是数据库系统 数据库系统是指在计算机系统中引入数据库后构成的系统&#xff0c;一般由数据库、数据库管理系统(及其开发工具)、应用系统、数据库管理员和用户构成 数据库系统的特点是什么&#xff1f; 数据结构化数据的共享性高&#xff0c;冗余度低且易扩充数据独立性高数…...

编程日记 2023/5/23 8:02:41

vscode插件推荐

文章目录前言一、vscode插件推荐&#xff1f;1、 Chinese (Simplified) (简体中文) Language Pack for Visual Studio Code2、Auto Close Tag3、Auto Import3、Error Lens4、vscode-icons5、ES7 React/Redux/React-Native snippets6、GitLens — Git supercharged7、JavaScript…...

编程日记 2023/5/23 8:02:39

THUPC2023初赛总结

今天参加了THUPC2023初赛&#xff0c;感觉还行。 比赛本来是11:00-16:00&#xff0c;但出了点问题&#xff0c;比赛延迟了十分钟。 刚开始&#xff0c;我从第一题往后看&#xff0c;寻找简单的题。 过了一会儿&#xff0c;一看排行榜&#xff0c;怎么最后一题全是绿的&#…...

编程日记 2023/5/15 13:19:15

unity知识点小结02

虚拟轴 虚拟轴就是一个数值在-11内的轴&#xff0c;这个数轴上重要的数值就是-1,0和1。当使用按键模拟一个完整的虚拟轴时需要用到两个按键&#xff0c;即将按键1设置为负轴按键&#xff0c;按键2设置为正轴按键。在没有按下任何按键的时候&#xff0c;虚拟轴的数值为0&#xf…...

编程日记 2023/5/23 8:02:34

总线（四）Modbus总线 协议

文章目录Modbus技术背景Modbus OSI分布Moudbus分类通讯过程Moudbus协议通信过程以及报文解析RTU 与 ASCII 收发数据区别Modbus技术背景 Modbus是一种串行通信协议。 1971年&#xff0c;Modicon公司首次退出Modbus协议&#xff0c;ModbusRTU和Modbus ASCII诞生于此。 后来施耐德…...

编程日记 2023/5/23 8:02:31

Cadence Allegro 导出Component Report详解

⏪《上一篇》   🏡《总目录》   ⏩《下一篇》 目录 1，概述2，Component Report作用3，Component Report示例4，Component Report导出方法4.1，方法14,2，方法2B站关注“硬小二”浏览更多演示视频 1，...

编程日记 2023/5/23 8:02:27

程序猿成长之路之密码学篇-DES算法详解

DES的算法实现原理详情请见 https://blog.csdn.net/qq_31236027/article/details/128209185 DES算法密钥获取详情请见 https://blog.csdn.net/qq_31236027/article/details/129224730 编码工具类获取详见 https://blog.csdn.net/qq_31236027/article/details/128579451 DES算法…...

编程日记 2023/5/23 8:02:22

maven生命周期、阶段与默认绑定插件梳理

maven生命周期、阶段与默认绑定插件梳理 CSDN博客 码云源码 1.maven生命周期、阶段与默认绑定插件 序号生命周期lifecycle阶段phase默认绑定插件(链接官网)默认绑定插件(链接maven库)说明1cleancleanmaven-clean-pluginmaven-clean-plugin清理2.1buildvalidate——验证2.2b…...

编程日记 2023/5/23 8:02:18

【数学基础】

文章目录『 第1讲 高等数学预备知识 』1.1 函数的概念与特性函数的四种特性【 重要结论 】1.2 函数的图像直角坐标系下的图像极坐标系下的图像参数方程1.3 常用基础知识【 情报#1 】『 第2讲 数列极限 』2.1 引言2.2 求数列极限【 情报#2 】『 第1讲 高等数学预备知识 』 1.1 …...

编程日记 2023/5/23 8:02:14

网上电子商城的设计与实现

技术&#xff1a;Java、JSP等摘要&#xff1a;21 世纪以来&#xff0c;人类经济高速发展&#xff0c;人们的生活发生了日新月异的变化&#xff0c;特别是计算机的应用及普及到经济和社会生活的各个领域。在消费领域&#xff0c;网上购物已经成为大众所接受的一种新型的消费方式…...

编程日记 2023/5/23 8:02:09

2023thupc总结

A 大富翁 很有意思的题 ∑x∈A∑y∈B[x支配y]−∑x∈A∑y∈B[y支配x]−∑x∈Awx\sum_{x\in A}\sum_{y\in B}[x支配y]-\sum_{x\in A}\sum_{y\in B}[y支配x]-\sum_{x\in A}w_x∑x∈A​∑y∈B​[x支配y]−∑x∈A​∑y∈B​[y支配x]−∑x∈A​wx​ ∑x∈A∑y[x支配y]−∑x∈A∑y[y支…...

编程日记 2023/5/23 8:02:04

【数据库】MySQL数据库基础

目录 1.数据库&#xff1a; 2.数据库基本操作 2.1 MySQL的运行原理 2.2显示数据库&#xff1a; 2.3创建数据库 2.4使用数据库 2.5删除数据库 3.常见的数据类型 3.1数值类型&#xff1a; 3.2字符型类型 3.3日期类型 4.表的操作 4.1创建表 4.2查看表 4.3删除表 5.汇总…...

编程日记 2023/5/23 8:01:59

【Oracle APEX开发小技巧12】

有如下需求&#xff1a; 有一个问题反馈页面&#xff0c;要实现在apex页面展示能直观看到反馈时间超过7天未处理的数据&#xff0c;方便管理员及时处理反馈。 我的方法&#xff1a;直接将逻辑写在SQL中&#xff0c;这样可以直接在页面展示 完整代码&#xff1a; SELECTSF.FE…...

编程新知 2026/2/7 17:35:15

Oracle查询表空间大小

1 查询数据库中所有的表空间以及表空间所占空间的大小 SELECTtablespace_name,sum( bytes ) / 1024 / 1024 FROMdba_data_files GROUP BYtablespace_name; 2 Oracle查询表空间大小及每个表所占空间的大小 SELECTtablespace_name,file_id,file_name,round( bytes / ( 1024 …...

编程新知 2025/11/8 0:24:13

家政维修平台实战20：权限设计

目录 1 获取工人信息2 搭建工人入口3 权限判断总结 目前我们已经搭建好了基础的用户体系&#xff0c;主要是分成几个表&#xff0c;用户表我们是记录用户的基础信息&#xff0c;包括手机、昵称、头像。而工人和员工各有各的表。那么就有一个问题&#xff0c;不同的角色&#xf…...

编程新知 2026/2/1 22:23:58

高危文件识别的常用算法：原理、应用与企业场景

高危文件识别的常用算法&#xff1a;原理、应用与企业场景 高危文件识别旨在检测可能导致安全威胁的文件&#xff0c;如包含恶意代码、敏感数据或欺诈内容的文档&#xff0c;在企业协同办公环境中&#xff08;如Teams、Google Workspace&#xff09;尤为重要。结合大模型技术&…...

编程新知 2026/2/8 10:51:42

如何在最短时间内提升打ctf（web)的水平？

刚刚刷完2遍 bugku 的 web 题&#xff0c;前来答题。 每个人对刷题理解是不同&#xff0c;有的人是看了writeup就等于刷了&#xff0c;有的人是收藏了writeup就等于刷了&#xff0c;有的人是跟着writeup做了一遍就等于刷了&#xff0c;还有的人是独立思考做了一遍就等于刷了。…...

编程新知 2026/1/28 5:55:15

Docker 本地安装 mysql 数据库

Docker: Accelerated Container Application Development 下载对应操作系统版本的 docker &#xff1b;并安装。 基础操作不再赘述。 打开 macOS 终端&#xff0c;开始 docker 安装mysql之旅 第一步 docker search mysql 》〉docker search mysql NAME DE…...

编程新知 2026/2/9 17:06:25

安宝特案例丨Vuzix AR智能眼镜集成专业软件，助力卢森堡医院药房转型，赢得辉瑞创新奖

在Vuzix M400 AR智能眼镜的助力下&#xff0c;卢森堡罗伯特舒曼医院&#xff08;the Robert Schuman Hospitals, HRS&#xff09;凭借在无菌制剂生产流程中引入增强现实技术&#xff08;AR&#xff09;创新项目&#xff0c;荣获了2024年6月7日由卢森堡医院药剂师协会&#xff0…...

编程新知 2026/2/9 2:41:28

uniapp 开发ios， xcode 提交app store connect 和 testflight内测

uniapp 中配置 配置manifest 文档&#xff1a;manifest.json 应用配置 | uni-app官网 hbuilderx中本地打包 下载IOS最新SDK 开发环境 | uni小程序SDK hbulderx 版本号&#xff1a;4.66 对应的sdk版本 4.66 两者必须一致 本地打包的资源导入到SDK 导入资源 | uni小程序SDK …...

编程新知 2026/1/31 8:35:07

MySQL 主从同步异常处理

阅读原文&#xff1a;https://www.xiaozaoshu.top/articles/mysql-m-s-update-pk MySQL 做双主&#xff0c;遇到的这个错误&#xff1a; Could not execute Update_rows event on table ... Error_code: 1032是 MySQL 主从复制时的经典错误之一&#xff0c;通常表示&#xff…...

编程新知 2025/11/7 10:02:17

自然语言处理——文本分类

文本分类 传统机器学习方法文本表示向量空间模型 特征选择文档频率互信息信息增益&#xff08;IG&#xff09; 分类器设计贝叶斯理论&#xff1a;线性判别函数 文本分类性能评估P-R曲线ROC曲线 将文本文档或句子分类为预定义的类或类别&#xff0c; 有单标签多类别文本分类和多…...

编程新知 2026/2/8 0:32:03