一.框架

（frameset）
1.用<frameset></frameset>代替了<body></body>
2.rows设置行的占页面的百分比；cols设置列的所占百分比；*表示剩余的百分比；frameborder设置框架的边框（取值0/1）0–不显示边框1–在每个页面之间都显示边框；bordercolor设置边框颜色；framespacing表示框架与框架间保留的空白距离。
3.noresize设置禁止用户拖拉框架大小；scrolling设置滚动条是否显示；src路径连接到内容页面
4.用法例：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8">

        <title></title>

    </head>

    <frameset rows="30%,*,10%" frameborder="1"  bordercolor="blue" framespacing="10">

        <frame src="02.html" noresize="noresize" scrolling="no" />

        <frameset cols="20%,70%,*">

            <frame src="03.html" />

            <frame src="01.html" noresize="noresize" scrolling="no"/>

            <frame src="index.html" noresize="noresize" scrolling="no"/>

        </frameset>

        <frame src="03.html" noresize="noresize" scrolling="no"/>

    </frameset>

</html>

二.内嵌
例：

<!DOCTYPE html>

<html>

    <head>

        <meta charset="utf-8" />

        <title></title>

        <link rel="stylesheet" href="css/01.css"/>

    </head>

    <body>

        <h1 align="center">个人简历</h1><!--标题-->

        <form><!--表单-->

        <table border="1" cellspacing="0" cellpadding="0" align="center"><!--表格-->

        <tr align="center">

            <td>姓名</td>

            <td><input type="text" placeholder="觅知网"/></td><!--placeholder设置提示-->

            <td>出生年月</td>

            <td><input type="text"placeholder="1996.05"/></td>

            <td rowspan="4">

                <div id="div1"><img src="img/希望.jpg" width="180" height="90"/></div></td>

        </tr><!--img插入图片-->

        <tr align="center">

            <td>名族</td>

            <td><input type="text"placeholder="汉"/></td>

            <td>政治面貌</td>

            <td><input type="text" placeholder="中共党员"/></td>

        </tr>

        <tr align="center">

            <td>电话</td>

            <td><input type="tel" name="tel" maxlength="11" placeholder="13500135000"/></td>

            <td>毕业院校</td>

            <td><input type="text" placeholder="广州科技大学"/></td>

        </tr>

        <tr align="center">

            <td>邮箱</td>

            <td><input type="email" placeholder="2968218682@qq.com"/></td>

            <td>学历</td>

            <td><input type="text" placeholder="专科"/></td>

        </tr>

        <tr align="center">

            <td>地址</td>

            <td colspan="4"><iframe src="dizhi.html" noresize="noresize" scrolling="no" width="600" height="30" frameborder="0"></iframe></td>

        </tr><!--iframe内嵌一个文件到单元格之中-->

        <tr align="center">

            <td>求职意向</td>

            <td colspan="4"><iframe src="qiuzhiyixiang.html" noresize="noresize" scrolling="no" width="600" height="30" frameborder="0"></iframe></td>

        </tr><!--noresize="noresize"用户无法改动拖拉边框大小-->

        <tr>

            <td>教育背景</td>

            <td colspan="4"><iframe src="jiaoyubeijing.html" noresize="noresize" scrolling="no" width="600" height="80"frameborder="0"></iframe></td>

        </tr><!--scrolling="no"设置滚动条不显示-->

        <tr>

            <td>实习经历</td>

            <td colspan="4"><iframe src="shixijingli.html"noresize="noresize" scrolling="no" width="600" height="140"frameborder="0"></iframe></td>

        </tr><!--frameborder="0"设置无边框-->

        <tr>

            <td>校内实践</td>

            <td colspan="4"><iframe src="xiaoneishijian.html" noresize="noresize" scrolling="no" width="600" height="140"frameborder="0"></iframe></td>

        </tr>

        <tr>

            <td>技能证书</td>

            <td colspan="4"><iframe src="jinengzhengshu.html"noresize="noresize" scrolling="no" width="600" height="60"frameborder="0"></iframe></td>

        </tr>

        <tr>

            <td>自我评价</td>

            <td colspan="4"><iframe src="ziwopingjia.html"noresize="noresize" scrolling="no" width="600" height="50"frameborder="0"></iframe></td>

        </tr>

        </table>

        </form>

    </body>

</html>

注释：iframe可以设置宽width和高height

HTML+CSS教程（二）frameset框架和iframe内嵌的更多相关文章

  1. MapReduce教程(二)MapReduce框架Partitioner分区<转>

    1 Partitioner分区 1.1 Partitioner分区描述 在进行MapReduce计算时,有时候需要把最终的输出数据分到不同的文件中,按照手机号码段划分的话,需要把同一手机号码段的数据放 ...

  2. Python3.x：selenium获取iframe内嵌页面的源码

    Python3.x:selenium获取iframe内嵌页面的源码 前言 在一些网页中经常会看到ifrmae/frame标签,iframe是嵌入式框架一般用来在已有的页面中嵌入另一个页面,当一个元素在 ...

  3. 如何根据iframe内嵌页面调整iframe高宽续篇

    接着昨天的工作 如何根据iframe内嵌页面调整iframe高宽 来说,按照文章中说的第二种方法实现代码如下: 实现 A.com/detail/view 页面的iframe代码如下: <ifra ...

  4. 关于selenium自动化对iframe内嵌元素的处理

    今天上班闲来无聊,于是来练练自动化,结果碰上了可恶的iframe,楼主,以前也遇到过,但是一直也没搞懂怎么处理的,都是抄别人的代码,今天决定独立解决试试.首先先来认识什么是iframe,它就长下图这样 ...

  5. MetaBase使用iframe内嵌到Vue页面样式优化

    Matebase是一个开源,易上手的BI工具,这里不做太多介绍了. 官网地址:https://www.metabase.com/ 解决问题描述: 使用iframe内嵌Metabase公开链接之后,页面 ...

  6. 如何根据iframe内嵌页面调整iframe高宽

    问题来自于工作的实例,我的一个域名A的页面,有个iframe,它可能内嵌了另一个域名B的页面,也可能内嵌域名C的页面,但是呢,B和C的页面大小是不一样的,特别是高是不一样的高,那么我如何设置ifram ...

  7. iframe内嵌页面——跨域通讯

      <template> <div class="act-form"> <iframe :src="src" ref=" ...

  8. 弹出iframe内嵌页面元素到父页面并全屏化

    (注册博客好久了,一直没舍得添砖加瓦,主要是每次想写点东西的时候,随便搜一搜发现都比我总结的都要好,甚感尴尬,但是总是要开始的,所以这就是我的第一篇博客,也绝不会是最后一篇,废话不多说,直接入正题) ...

  9. 使用iframe内嵌PC网站实现高度自适应

    加个样式 <style> iframe { display: block; border: none; height: 90vh;/*设置高度百分比,一直调到只有一个滚动调为止*/ wid ...

随机推荐

  1. Building Applications with Force.com and VisualForce(Dev401)(十三):Implementing Business Processes:Automating Business Processes Part II

    ev401-014:Implementing Business Processes:Automating Business Processes Part II Module Agenda1.Multi ...

  2. OpenCV-Python 理解K近邻 | 五十三

    目标 在本章中,我们将了解k近邻(kNN)算法的原理. 理论 kNN是可用于监督学习的最简单的分类算法之一.这个想法是在特征空间中搜索测试数据的最近邻.我们将用下面的图片来研究它. 在图像中,有两个族 ...

  3. OpenCV-Python 图像上的算术运算 | 十一

    目标 学习图像的几种算术运算,例如加法,减法,按位运算等. 您将学习以下功能:cv.add,cv.addWeighted等. 图像加法 您可以通过OpenCV函数cv.add()或仅通过numpy操作 ...

  4. Colab笔记本能用英伟达Tesla T4了，谷歌的羊毛薅到酸爽

    谷歌出品的Colab笔记本,机器学习界薅羊毛神器,如今又有了新福利: 连英伟达最新一代机器学习GPU:Tesla T4都能免费蹭,穷苦羊毛党也顿时高端了起来. 英伟达的Tesla T4,是去年秋天才发 ...

  5. iOS提审笔记

    查看苹果各大系统的服务状态:中国区服务:https://www.apple.com/cn/support/systemstatus/美国区服务:https://developer.apple.com/ ...

  6. Ubuntu系统安装wxPython问题

    wxPython介绍 wxPython是Python语言的GUI工具包,作为Python的扩展模块实现,包装了wxWidgets.wxPython是跨平台的,开源的.详情 wxPython安装 (1) ...

  7. Blazor入门笔记（5）-数据绑定

    1.环境 VS2019 16.5.1 .NET Core SDK 3.1.200 Blazor WebAssembly Templates 3.2.0-preview2.20160.5 2.默认绑定 ...

  8. PTA数据结构与算法题目集(中文) 7-23

    PTA数据结构与算法题目集(中文)  7-23 7-23 还原二叉树 (25 分)   给定一棵二叉树的先序遍历序列和中序遍历序列,要求计算该二叉树的高度. 输入格式: 输入首先给出正整数N(≤50) ...

  9. Linux 定时实行一次任务命令

    当我们想在指定的时间自动执行 一次 任务的时候,可以使用at命令 启动服务 使用时首先检查atq的服务是否启动 service atd status # 检查atd的状态 service atd st ...

  10. Ansible Playbook 变量与 register 详解

    ansible 定义变量方式与[多层]变量引用,以及 register 详解 主机规划 添加用户账号 说明: 1. 运维人员使用的登录账号: 2. 所有的业务都放在 /app/ 下「yun用户的家目录 ...