zoukankan      html  css  js  c++  java
  • html(四) -- 框架标签

    框架标签

    frameSet : 一个frameSet可以把一个页面切割成多份,但是只能按照行或者列切割。

    frame   不能被切割的。 frame是位于frameSet中。

    iframe:  在一个网页中分隔一部分的位置显示另外一个网页的的信息。
        
    注意: frameSet标签不能用于body标签体内容。

    代码示例:

    index.html

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <title>无标题文档</title>
     6 </head>
     7 
     8     <frameset  rows="20%,70%,*" >
     9         <frame  src="top.html" />
    10         <frameset cols="20%,*">
    11             <frame src="left.html" />
    12             <frame name="center" src="center.html"/>
    13         </frameset>
    14         <frame src="foot.html"/>
    15     </frameset><noframes></noframes>
    16 
    17 </html>
    View Code

    top.html

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <title>无标题文档</title>
     6 </head>
     7 <body>
     8     <div align="center"><font color="#FF0000" size="30px">公司的logo</font></div>
     9 
    10 </body>
    11 </html>
    View Code

    left.html

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <title>无标题文档</title>
     6 </head>
     7 <body>
     8 <dl>
     9     <dt>功能介绍</dt>
    10     <dd><a href="../2常用的标签.html" target="center" >公司简介</a></dd>
    11     <dd><a href="#">产品介绍</a></dd>
    12     <dd><a href="#">公司荣耀</a></dd>
    13     <dd><a href="#">招聘英才</a></dd>
    14     <dd><a href="#">联系我们</a></dd>
    15 </dl>
    16 </body>
    17 </html>
    View Code

    center.html

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <title>无标题文档</title>
     6 </head>
     7 <body>
     8     公司创建于2006年,一直专注于java培训等...公司创建于2006年,一直专注于java培训等...公司创建于2006年,一直专注于java培训等...
     9 
    10 </body>
    11 </html>
    View Code

    bottom.html

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <title>无标题文档</title>
     6 </head>
     7 <body>
     8     <div align="center">
     9         合作伙伴:百度、 腾讯、 微软、甲骨文....<br/>
    10         联系方式:020-123456
    11     </div>
    12 
    13 </body>
    14 </html>
    View Code
  • 相关阅读:
    js函数的Json写法
    Bootstrap3和Bootstrap4区别
    Unicode编码是什么
    保留字是什么
    范仁义js课程---5、js字面量和变量
    什么是脚本语言
    ECMAScript 版本
    TortoiseGit上传代码到GitHub
    Android Studio快捷键
    Android 适配
  • 原文地址:https://www.cnblogs.com/nicker/p/6284242.html
Copyright © 2011-2022 走看看