网站建设学习(五)——HTML框架标签

 

     上一篇介绍了表单标签以及转义字符的使用,这一篇主要介绍框架标签的使用,在执行本篇代码时,请分别建立:html框架标签.html,html框架标签_1.html,html框架标签_2.html,三个文件于同一文件夹下执行代码,框架标签是多个页面的集合展示,所以要进行如此处理。

html框架标签.html:

<!--html: hyper text markup language 超文本标记语言

    超级文本:可以对文本进行设计,布局,装饰等等操作
    标记:标签的各种布局,可以进行文本设计,标签包括开始与结束
-->


<!--开始设计一个HTML页面-->

<html>
<!--  标签html:内部包含整个HTML页面,所有的设计均在当前的html标签内部进行-->
    <head>
    <!--整个文件的头部,里面包括一些属性供浏览器识别解析,对用户不可见-->

        <title>标题</title>
        <!--标签title,说明整个页面的标题,最终显示在浏览器加载页面的标签页-->

        <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
        <!--告诉浏览器以utf-8的码表进行解码,防止中文乱码,meta标签是无标签体标签,结束在开始标签后加反斜杠,即空标签-->

        <meta name="keywords" content="html,展示"/>
        <!--展示此网页的关键词,供搜索引擎使用,以“,”分开,其中关键词个数为权重,越多权重越低,一般为3到5个-->

        <meta name="description" content="html编程学习"/>
        <!--网页描述,展示在搜索引擎的网页的索引页面-->
    </head>

    <!--框架标签可以理解为独立的页面,即一个框架一个页面,最终将这些框架组装到一个页面上,因此框架与body类似等价,不在body标签内-->
    <frameset rows="20%,*,20%">
        <noframes>
            <body>不支持框架!</body>
        </noframes>
        <!--noframe标签表示当浏览器不支持框架时的显示-->
        <frame src="html框架标签_1.html" name="First_show"/>
        <frameset cols="30%,*">
            <frame src="html框架标签_1.html"/>
            <frame src="html框架标签_1.html"/>
        </frameset>
        <frame src="html框架标签_1.html"/>
    </frameset>
    <!--frameset标签是将整个页面分为不同的框架,最外层以行分割,内层以列分割-->
    <!--rows是以行分割时每行占得百分比,共100%,*表示剩余的部分,cols表示列框架占的比例-->
    <!--frame标签则表示具体的框架构成,src里是页面的地址,这里为方便,四部分页面全为同一页面,也可分别写不同页面-->
    <!--name属性表示的是这个框架的名称,可以依次对框架部分进行操作,可参看_1页面注释-->

    <body>
    <!--整个文件的体,设计元素在这个部分中,最终展示给用户-->
    </body>

</html>

html框架标签.html_1:

<!--html: hyper text markup language 超文本标记语言

    超级文本:可以对文本进行设计,布局,装饰等等操作
    标记:标签的各种布局,可以进行文本设计,标签包括开始与结束
-->


<!--开始设计一个HTML页面-->

<html>
<!--  标签html:内部包含整个HTML页面,所有的设计均在当前的html标签内部进行-->
    <head>
    <!--整个文件的头部,里面包括一些属性供浏览器识别解析,对用户不可见-->

        <title>标题</title>
        <!--标签title,说明整个页面的标题,最终显示在浏览器加载页面的标签页-->

        <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
        <!--告诉浏览器以utf-8的码表进行解码,防止中文乱码,meta标签是无标签体标签,结束在开始标签后加反斜杠,即空标签-->

        <meta name="keywords" content="html,展示"/>
        <!--展示此网页的关键词,供搜索引擎使用,以“,”分开,其中关键词个数为权重,越多权重越低,一般为3到5个-->

        <meta name="description" content="html编程学习"/>
        <!--网页描述,展示在搜索引擎的网页的索引页面-->
    </head>


    <body>
    <!--整个文件的体,设计元素在这个部分中,最终展示给用户-->
        <h1><a href="html框架标签_2.html" target="First_show">标签框架之一</a></h1>
        <!--这里对标签设置链接,当点击链接时会跳转到_2页面,target表示目标,默认是在自己的框架中显示,加上名字后会在该名字下的框架中显示-->
        <!--框架也是页面,多个页面组成主页面,这多个页面(框架)要有一个名字表示,链接跳转时有明确的跳转目标,也有利于其他操作-->
    </body>

    

</html>

html框架标签.html_2:

<!--html: hyper text markup language 超文本标记语言

    超级文本:可以对文本进行设计,布局,装饰等等操作
    标记:标签的各种布局,可以进行文本设计,标签包括开始与结束
-->


<!--开始设计一个HTML页面-->

<html>
<!--  标签html:内部包含整个HTML页面,所有的设计均在当前的html标签内部进行-->
    <head>
    <!--整个文件的头部,里面包括一些属性供浏览器识别解析,对用户不可见-->

        <title>标题</title>
        <!--标签title,说明整个页面的标题,最终显示在浏览器加载页面的标签页-->

        <meta http-equiv="content-type" content="text/html;charset=utf-8"/>
        <!--告诉浏览器以utf-8的码表进行解码,防止中文乱码,meta标签是无标签体标签,结束在开始标签后加反斜杠,即空标签-->

        <meta name="keywords" content="html,展示"/>
        <!--展示此网页的关键词,供搜索引擎使用,以“,”分开,其中关键词个数为权重,越多权重越低,一般为3到5个-->

        <meta name="description" content="html编程学习"/>
        <!--网页描述,展示在搜索引擎的网页的索引页面-->
    </head>


    <body>
    <!--整个文件的体,设计元素在这个部分中,最终展示给用户-->
        <h1>在头部显示跳转内容</h1>
    </body>

    

</html>

网页编程规范参考链接:w3school 在线教程

       这其中有不合适或者不正确的地方欢迎指正,我的QQ号码:2867221444(乔金明),谢谢,也可以相互交流下,备注信息随意,只要能看得出是开发者或者学习者即可。

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值