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

HTML 框架

news 2025/12/27 14:16:57

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

内存分配函数malloc kmalloc vmalloc

内存分配函数malloc kmalloc vmalloc malloc实现步骤： 1）请求大小调整：首先，malloc 需要调整用户请求的大小，以适应内部数据结构（例如，可能需要存储额外的元数据）。通常，这包括对齐调整，确保分配的内存地址满足特定硬件要求（如对齐到8字节或16字节边界）。 2）空闲…...

编程新知 2025/11/1 5:21:39

PPT|230页| 制造集团企业供应链端到端的数字化解决方案：从需求到结算的全链路业务闭环构建

制造业采购供应链管理是企业运营的核心环节&#xff0c;供应链协同管理在供应链上下游企业之间建立紧密的合作关系&#xff0c;通过信息共享、资源整合、业务协同等方式&#xff0c;实现供应链的全面管理和优化&#xff0c;提高供应链的效率和透明度&#xff0c;降低供应链的成…...

编程新知 2025/12/22 8:47:09

2025 后端自学UNIAPP【项目实战：旅游项目】6、我的收藏页面

代码框架视图 1、先添加一个获取收藏景点的列表请求 【在文件my_api.js文件中添加】 // 引入公共的请求封装 import http from ./my_http.js// 登录接口&#xff08;适配服务端返回 Token&#xff09; export const login async (code, avatar) > {const res await http…...

编程新知 2025/12/20 19:07:28

【RockeMQ】第2节｜RocketMQ快速实战以及核⼼概念详解（二）

升级Dledger高可用集群 一、主从架构的不足与Dledger的定位 主从架构缺陷 数据备份依赖Slave节点&#xff0c;但无自动故障转移能力&#xff0c;Master宕机后需人工切换&#xff0c;期间消息可能无法读取。Slave仅存储数据&#xff0c;无法主动升级为Master响应请求&#xff…...

编程新知 2025/9/2 3:37:40

CRMEB 框架中 PHP 上传扩展开发：涵盖本地上传及阿里云 OSS、腾讯云 COS、七牛云

目前已有本地上传、阿里云OSS上传、腾讯云COS上传、七牛云上传扩展 扩展入口文件 文件目录 crmeb\services\upload\Upload.php namespace crmeb\services\upload;use crmeb\basic\BaseManager; use think\facade\Config;/*** Class Upload* package crmeb\services\upload* …...

编程新知 2025/11/12 7:08:59

ios苹果系统，js 滑动屏幕、锚定无效

现象&#xff1a;window.addEventListener监听touch无效&#xff0c;划不动屏幕&#xff0c;但是代码逻辑都有执行到。 scrollIntoView也无效。 原因&#xff1a;这是因为 iOS 的触摸事件处理机制和 touch-action: none 的设置有关。ios有太多得交互动作&#xff0c;从而会影响…...

编程新知 2025/12/21 1:58:35

RNN避坑指南：从数学推导到LSTM/GRU工业级部署实战流程

本文较长&#xff0c;建议点赞收藏&#xff0c;以免遗失。更多AI大模型应用开发学习视频及资料&#xff0c;尽在聚客AI学院。 本文全面剖析RNN核心原理&#xff0c;深入讲解梯度消失/爆炸问题&#xff0c;并通过LSTM/GRU结构实现解决方案&#xff0c;提供时间序列预测和文本生成…...

编程新知 2025/12/26 13:33:35

使用Matplotlib创建炫酷的3D散点图：数据可视化的新维度

文章目录 基础实现代码代码解析进阶技巧1. 自定义点的大小和颜色2. 添加图例和样式美化3. 真实数据应用示例实用技巧与注意事项完整示例（带样式）应用场景在数据科学和可视化领域，三维图形能为我们提供更丰富的数据洞察。本文将手把手教你如何使用Python的Matplotlib库创建引…...

编程新知 2025/10/4 3:01:43

视觉slam十四讲实践部分记录——ch2、ch3

ch2 一、使用g++编译.cpp为可执行文件并运行(P30) g++ helloSLAM.cpp ./a.out运行 二、使用cmake编译 mkdir build cd build cmake .. makeCMakeCache.txt 文件仍然指向旧的目录。这表明在源代码目录中可能还存在旧的 CMakeCache.txt 文件，或者在构建过程中仍然引用了旧的路…...

编程新知 2025/12/15 19:17:34

并发编程 - go版

1.并发编程基础概念 进程和线程 A. 进程是程序在操作系统中的一次执行过程&#xff0c;系统进行资源分配和调度的一个独立单位。B. 线程是进程的一个执行实体,是CPU调度和分派的基本单位,它是比进程更小的能独立运行的基本单位。C.一个进程可以创建和撤销多个线程;同一个进程中…...

编程新知 2025/12/25 3:08:06