百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

HTML 框架标签——frameset html框架及常用标签

zhezhongyun 2024-12-24 16:55 69 浏览

框架是将一个页面划分为若干个窗口, 每一个窗口都是独立;

要实现框架必须使用框架型的DTD;

框架就像一个窗户是由窗格和玻璃组成;

框架中不能有body及body子标记;

框架是由框架集(frameset)和框架页(frame)组成;

格式:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
</head>
<frameset>
<frame />
<frame />
</frameset>
</html>

框架标签:

<frameset></frameset> 放在一个框架文档的<body>标签之前, 也可以嵌在其他框架文档中;

框架中不能有body及body子标记, 框架是由框架集(frameset)和框架页(frame)组成;

<frameset rows="value,value"> 定义一个框架内的行数, 可用像素值或高度百分比;

<frameset cols="value,value"> 定义一个框架内的列数, 可用像素值或宽度百分比;

<frameset cols="120,*"></frameset>

<frameset cols="25%,50%,25%"></frameset>

<frameset rows="120,*"></frameset>

<frameset rows="25%,50%,25%"></frameset>

frameborder 框架边框显示属性

该属性用于指定框架周围是否显示边框, 取值有1(显示边框, 默认值)和0(不显示边框)。

framespacing 该属性用于指定框架之间的间隔, 以像素为单位。

如果不设置该属性,则框架之间没有间隔。

border 指定边框宽度属性

该属性用于指定边框的宽度, 只有在frameborder属性为1时有效。

bordercolor 指定边框颜色

<noframes></noframes> 定义在不支持框架的浏览器中显示什么提示;

<html>
<frameset cols="25%,50%,25%">
<frame src="frame_a.html"/>
<frame src="frame_b.html"/>
<frame src="frame_c.html"/>
<noframes>
<body>您的浏览器无法处理框架!</body>
</noframes>
</frameset>
</html>

<frame> 定义一个框架内的单一窗或窗区域;

<frame src="url"> 规定框架内显示的html文档;

<frame name="name"> 命名框架或区域以便别的框架可以指向它;

<frame marginwidth=""> 定义框架左右边缘的空白大小,必须大于等于1;

<frame marginheight=""> 定义框架上下边缘的空白大小,必须大于等于1;

<frame scrolling=""> 设置框架是否有滚动栏,其值可以是"yes","no",或"auto";

<frame noresize> 禁止用户调整一个框架的大小;其值只有一个"noresize"

<frame src="frame_a.htm" longdesc="w3school.txt" /> longdesc属性指向了带有框架内容长描述的页面:

<iframe></iframe> 创建一个内联的框架;

src 定义在框架中显示的内容的来源;

frameborder 规定是否显示框架周围的边框。(0或1);

align 控制对齐方式(left、right、middle、top、bottom);

height 框架的高度,

width 框架的宽度;

marginheight 定义 iframe 的顶部和底部的边距。

marginwidth 定义 iframe 的左侧和右侧的边距。

scrolling 规定是否在 iframe 中显示滚动条(yes、no、auto)。

name 规定 iframe 的名称。

bordercolor 指定边框颜色

<iframe src ="/index.html" frameborder="0" bordercolor="red">

<p>Your browser does not support iframes.</p>

</iframe>


关于框架集<frameset></frameset>中属性cols rows分割方法理解

<frameset cols="40%,2*,*"> 将窗口分为40%,40%,20%

<frameset cols="100,200,*"> 将窗口分为100像素,200像素和剩下的700像素

<frameset cols="100,*,*">    将100像素以外的窗口平均分配

<frameset cols="*,*,*">     将窗口分为三等份

<frameset rows="*,*,*"> 总共有三个按列排列的帧,每个帧占整个浏览器窗口的1/3

<frameset cols="40%,*,*"> 总共有三个按行排列的帧,第一个帧占整个浏览器窗口的40%,剩下的空间平均分配给另外两个帧

<frameset rows="40%,*" cols="50%,*,200">

以上"*"表示剩余部分

总共有六个帧,先是在第一行中从左到右排列三个帧,然后在第二行中从左到右再排列三个帧,即两行三列,

所占空间依据rows和cols属性的值,其中200的单位是像素

属性汇总:

frameset(框架集)

rows 它是将框架集划分为上下型

cols 它是将框架划分为左右型

border 是用于设置框架的边框粗细

frameborder 是用于设置是否显示边框, 取值:yes|no或1|0

bordercolor 用于设置框架边框的颜色

frame(框架页)

noresize 是否可以调整小窗口的大小

name 用于设置小窗口的名称

src 小窗口的url

scroll 是否显示滚动条 yes|no|auto

实例: iframe满屏方案

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>iframe满屏方案</title>
<style>
body {
margin: 0; /* Reset default margin */
}
iframe {
display: block; /* iframes are inline by default */
background: #000;
border: none; /* Reset default border */
height: 100vh; /* Viewport-relative units */
width: 100vw;
}
</style>
</head>
<body>
<iframe src="http://xxx.xxx.xxx.xxx:10002/vnc.html?username=superadmin&course=hd-linux&chart=hd-linux&version=v1.0.0"></iframe>
</body>
</html>

相关推荐

Python入门学习记录之一:变量_python怎么用变量

写这个,主要是对自己学习python知识的一个总结,也是加深自己的印象。变量(英文:variable),也叫标识符。在python中,变量的命名规则有以下三点:>变量名只能包含字母、数字和下划线...

python变量命名规则——来自小白的总结

python是一个动态编译类编程语言,所以程序在运行前不需要如C语言的先行编译动作,因此也只有在程序运行过程中才能发现程序的问题。基于此,python的变量就有一定的命名规范。python作为当前热门...

Python入门学习教程:第 2 章 变量与数据类型

2.1什么是变量?在编程中,变量就像一个存放数据的容器,它可以存储各种信息,并且这些信息可以被读取和修改。想象一下,变量就如同我们生活中的盒子,你可以把东西放进去,也可以随时拿出来看看,甚至可以换成...

绘制学术论文中的“三线表”具体指导

在科研过程中,大家用到最多的可能就是“三线表”。“三线表”,一般主要由三条横线构成,当然在变量名栏里也可以拆分单元格,出现更多的线。更重要的是,“三线表”也是一种数据记录规范,以“三线表”形式记录的数...

Python基础语法知识--变量和数据类型

学习Python中的变量和数据类型至关重要,因为它们构成了Python编程的基石。以下是帮助您了解Python中的变量和数据类型的分步指南:1.变量:变量在Python中用于存储数据值。它们充...

一文搞懂 Python 中的所有标点符号

反引号`无任何作用。传说Python3中它被移除是因为和单引号字符'太相似。波浪号~(按位取反符号)~被称为取反或补码运算符。它放在我们想要取反的对象前面。如果放在一个整数n...

Python变量类型和运算符_python中变量的含义

别再被小名词坑哭了:Python新手常犯的那些隐蔽错误,我用同事的真实bug拆给你看我记得有一次和同事张姐一起追查一个看似随机崩溃的脚本,最后发现罪魁祸首竟然是她把变量命名成了list。说实话...

从零开始:深入剖析 Spring Boot3 中配置文件的加载顺序

在当今的互联网软件开发领域,SpringBoot无疑是最为热门和广泛应用的框架之一。它以其强大的功能、便捷的开发体验,极大地提升了开发效率,成为众多开发者构建Web应用程序的首选。而在Spr...

Python中下划线 ‘_’ 的用法,你知道几种

Python中下划线()是一个有特殊含义和用途的符号,它可以用来表示以下几种情况:1在解释器中,下划线(_)表示上一个表达式的值,可以用来进行快速计算或测试。例如:>>>2+...

解锁Shell编程:变量_shell $变量

引言:开启Shell编程大门Shell作为用户与Linux内核之间的桥梁,为我们提供了强大的命令行交互方式。它不仅能执行简单的文件操作、进程管理,还能通过编写脚本实现复杂的自动化任务。无论是...

一文学会Python的变量命名规则!_python的变量命名有哪些要求

目录1.变量的命名原则3.内置函数尽量不要做变量4.删除变量和垃圾回收机制5.结语1.变量的命名原则①由英文字母、_(下划线)、或中文开头②变量名称只能由英文字母、数字、下画线或中文字所组成。③英文字...

更可靠的Rust-语法篇-区分语句/表达式,略览if/loop/while/for

src/main.rs://函数定义fnadd(a:i32,b:i32)->i32{a+b//末尾表达式}fnmain(){leta:i3...

C++第五课:变量的命名规则_c++中变量的命名规则

变量的命名不是想怎么起就怎么起的,而是有一套固定的规则的。具体规则:1.名字要合法:变量名必须是由字母、数字或下划线组成。例如:a,a1,a_1。2.开头不能是数字。例如:可以a1,但不能起1a。3....

Rust编程-核心篇-不安全编程_rust安全性

Unsafe的必要性Rust的所有权系统和类型系统为我们提供了强大的安全保障,但在某些情况下,我们需要突破这些限制来:与C代码交互实现底层系统编程优化性能关键代码实现某些编译器无法验证的安全操作Rus...

探秘 Python 内存管理:背后的神奇机制

在编程的世界里,内存管理就如同幕后的精密操控者,确保程序的高效运行。Python作为一种广泛使用的编程语言,其内存管理机制既巧妙又复杂,为开发者们提供了便利的同时,也展现了强大的底层控制能力。一、P...