首页 问答社区 web技术 正文

框架标签和其他标签

2021-02-06 16:42:20 178 0
tangjin

框架标签

在平时浏览网页的时候，一般网页都会按照如下图中的格式进行分块：

要想实现上面的分块格式，html提供了框架标签（目前企业开发中使用这种方式的不多了），下面通过代码来实现上图中的格式。

主框架：

<!DOCTYPE html >
<html>
<head>
<meta  charset=UTF-8">
<title>Insert title here</title>
</head>

<frameset rows="120,*,80">
    <frame src="top.html" >
    <frameset cols="120,*">
        <frame src="left.html">
        <frame name="right" src="right.html">
    </frameset>
    <frame src="bottom.html"></frame>
</frameset>

</html>

左框架：

<!DOCTYPE html>
<html>
<head>
<meta charset=UTF-8">
<title>Insert title here</title>
</head>
<body>
    <a href="menu1.html" target="right">menu1</a>
    <a href="menu2.html" target="right">menu2</a>
    <a href="menu3.html" target="right">menu3</a>
</body>
</html>

左框架中的菜单：

<!DOCTYPE html>
<html>
<head>
<meta charset=UTF-8">
<title>left1</title>
</head>
<body>
    menu1
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset=UTF-8">
<title>left2</title>
</head>
<body>
    menu2
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset=UTF-8">
<title>left3</title>
</head>
<body>
    menu3
</body>
</html>

右框架：

<!DOCTYPE html>
<html>
<head>
<meta charset=UTF-8">
<title>right</title>
</head>
<body>
    right
</body>
</html>

顶框架：

<!DOCTYPE html >
<html>
<head>
<meta charset=UTF-8">
<title>top</title>
</head>
<body>
    top
</body>
</html>

底部框架

<!DOCTYPE html >
<html>
<head>
<meta charset=UTF-8">
<title>bottom</title>
</head>
<body>
    bottom
</body>
</html>

标签说明：

框架标签
    frameset:
        属性：
            rows；按行划分
            cols：按列划分
            划分格式： rows="120,*,80",*表示剩余空间
    frame:
        属性：    
            name：名称，方便target根据name值进行定位
            src:页面地址；

其他标签

<meta>
        <meta name="keywords" content="keyword1,keyword2,keyword3">
        <meta name="description" content="this is my page">
        <meta charset=UTF-8">
<link>
    <link rel="stylesheet" type="text/css" href="./styles.css">
        href：引入css文件的地址
<script>
    <script type="text/javascript" src=""></script>
        src：js的文件地址

标签说明：

<meta name="keywords" content="keyword1,keyword2,keyword3">content中写一些网页的关键词

<meta name="description" content="this is my page">content中写网页的描述简介

上面两个主要是给搜索引擎看的，比如在百度搜索某个关键词后，在搜索结果中会展示description中的内容。

<link>和<script>是用来引入外部的css文件和javascript文件，这样html才会跟他们产生关系

特殊字符

&nbsp; 空格
&gt;   大于号
&lt;   小于号
&copy; 版权符号
&reg;  注册符号
html
收藏
分享
海报
0 条评论
178
上一篇：HTML链接标签和表格标签 下一篇：CSS概述

相关文章

本站已关闭游客评论，请登录或者注册后再评论吧~

忘记密码？

图形验证码