HTML框架

最新推荐文章于 2021-11-02 18:47:46 发布

WinkJie

最新推荐文章于 2021-11-02 18:47:46 发布

阅读量116

点赞数

分类专栏：前端文章标签：框架 HTML

本文链接：https://blog.csdn.net/qq_36662459/article/details/92213030

版权

前端专栏收录该内容

17 篇文章 0 订阅

订阅专栏

1.框架集

我们可以通过框架，在一个浏览器窗口中显示多个页面。

HTML框架集的使用十分简单，我们需要用到如下2个标签：

<frameset></frameset>
<frame></frame>

2.框架属性

frameset主要有以下属性：

rows
cols
boeder 该属性用于指定框架边框宽度，单位为px。
frameborder 该属性为1时显示框架边框，0时不显示框架边框。
bordercolor 该属性用于指定框架边框颜色。

rows

rows属性用于设定水平框架占原窗口面积。

例如：

<frameset cols="100, *">  将窗口分为两个横向框架，第一个占100px，第二个占剩余部分。
<frameset cols="20%, 30%, 50%">  将窗口分为三个横向框架，第一个占横向20%，第二个30%，第三个50%。
<frameset cols="100, *, 10%">  将窗口分为三个横向框架，第一个占100px，第三个占10%，第二个占剩余部分。

cols

cols属性用于设定垂直框架占原窗口面积。

用法同rows。

frame的属性

name 设定框架名称。
src 指定框架内容。
noresize 设置该frame边框可否被拉动。
scrolling 设定frame是否有滚动条：yes，no，auto。

混合框架示例

<html>
<head>
    <title>Frame Test</title>
</head>
<frameset rows="40%, 60%" noresize="noresize" bordercolor="gray">
  <frame src="http://blog.csdn.net/a153375250">
  <frameset cols="50%, 50%" noresize="noresize" bordercolor="gray" border=1>
    <frame src="https://www.baidu.com/">
    <frame src="https://guides.github.com/activities/hello-world/">
  </frameset>
</frameset>

</html>

导航框架+显示框架

首先创建frameset.html：

frameset.html

<html>
  <head>
    <title>Frameset</title>
  </head>
  <frameset cols="10%, 90%" noresize="noresize" bordercolor="gray" border=1>
    <frame src="frame_index.html" name="index">
    <frame src="http://baidu.com" name="content">
  </frameset>
</html>

其中第一个框架的src指向下面的导航页面index.html，<frame>中target指定页面显示在name=content的框架中，也就是我们第二个frame。

index.html

<a href="http://www.baidu.com" target="content">baidu</a><br/>
<a href="http://blog.csdn.net/a153375250" target="content">csdn blog</a>

WinkJie

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

专栏目录