菜鸟零基础学习HTML5   ----- 1.6、HTML5框架、背景和实体

一、HTML框架

   1、框架标签(frame):(已过时)

    框架对于页面的设计有着很大的作用

   2、框架集标签(<frameset>):(已过时)

    框架集标签定义如何将窗口分割为框架

    每一个frameset定义一系列行或者列

    rows/cols的值规定了每行或每列占据屏幕的面积

   3、常用标签:

    noresize:固定框架大小

    cols:列

    rows:行

例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>框架</title>
</head>

    <frameset rows="20%,50%,30%">
        <!--新建三个网页frameA.html、frameB.html、frameC.html,自定义一下网页的颜色-->
        <frame src="frameA.html"></frame>
        <frame src="frameB.html"></frame>
        <frame src="frameC.html"></frame>
    </frameset>
</html>

   4、内联框架:

    iframe

例:

主页面index01.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>框架</title>
</head>
    <iframe src="frameC.html" frameborder="0" width="800" height="800">

    </iframe>
</html>

frameA.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body bgcolor="#f0f8ff">
<h1>FrameA</h1>
<a href="http://www.qq.com" target="_self">腾讯网</a><br/>
<!--target="_self"在自己的空间打开-->
<a href="http://www.baidu.com" target="_blank">百度一下</a><br/>
<!--target="_blank"在新的窗口打开-->
<a href="http://www.taobao.com" target="_parent">淘宝网</a><br/>
<!--target="_parent"在父级容器打开-->
<a href="http://www.51cto.com" target="_top">51cto</a>
<!--target="_top"在本窗口打开-->
</body>
</html>

frameB.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body bgcolor="aqua">
    <h1>FrameB</h1>
    <iframe src="frameA.html" width="400px"height="400px"></iframe>

</body>
</html>

FrameC.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body bgcolor="#ff7f50">
    <h1>FrameC</h1>
    <iframe src="frameB.html" width="600px" height="600px"></iframe>

</body>
</html>

效果如下:

wKiom1YU4THT8R07AAD9F4Wju4Q636.jpg二、HTML背景

  1、背景标签:

    Background

   2、背景颜色:

    Bgcolor

   3、颜色:

    颜色是由一个十六进制符号来定义,这个符号由红色、绿色、蓝色的值组成(RGB)

    颜色的最小值:0 (#00)

    颜色的最大值:255(#FF)

    红色:#FF0000

    绿色:#00FF00

    蓝色:#0000FF

三、HTML5实体

   1、实体:

    HTML中预留字符串必须被替代成字符实体

    如:<、>、&

例:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>HTML实体</title>
</head>
<body>
<!--想要在页面内显示“<html>”直接输入<html>无法实现-->
    百度一下<html>
<br/>
<!--想要在页面内显示“<html>”,必须要通过实体替代-->
    百度一下&lt;html&gt;
</body>
</html>

其它实体的具体书写形式可以通过百度百科查得:

http://baike.baidu.com/link?url=zCSNFicUzegXr1PRuTy85WvcXkL-_kEIFV8KZTA-dRW4iFHCfc4PZVAfli1WWIIn15BxAdRE4_k1VEZ1h95uz_

本文出自 “Fcheng” 博客,谢绝转载!

你可能感兴趣的:(html5框架,html5背景,html5实体)