HTML框架没有出现

时间:2016-11-06 06:03:55

标签: html

我正在尝试使用框架创建一个简单的网页。 目前我的文件index.html包含以下代码:

<!doctype html>

<html lang="en">
<head>
    <meta charset="utf-8">

    <title>Index</title>
    <meta name="description" content="description">
    <meta name="author" content="author">

    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/main.css">

    <!--[if lt IE 9]>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
    <![endif]-->
</head>

<frameset>
    <frame name="header" src="header.html">
    <frame name="sidebar" src="sidebar.html">
    <frame name="mainarea" src="home.html">
    <frame name="footer" src="footer.html">
</frameset>

</html>

文件header.html,sidebar.html,home.html和footer.html都如下所示:

<!doctype html>

<html lang="en">
<head>
  <meta charset="utf-8">

  <title>Header</title>
  <meta name="description" content="description">
  <meta name="author" content="author">

  <link rel="stylesheet" href="css/base.css">
  <link rel="stylesheet" href="css/main.css">

  <!--[if lt IE 9]>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/html5shiv/3.7.3/html5shiv.js"></script>
  <![endif]-->
</head>

<body>

  <p>Header</p>

</body>
</html>

当我尝试打开文件(index.html)时,我得到this

我做错了什么?我想要显示所有4个html文件,而不仅仅是第一个。

1 个答案:

答案 0 :(得分:0)

您需要在rows元素上指定colsframeset - 或者浏览器不知道如何调整框架的大小,并且不会正确显示它们。

例如,这段代码会产生四个象限:

<frameset cols="50%,*" rows="50%,*">
    <frame name="header" src="header.html">
    <frame name="sidebar" src="sidebar.html">
    <frame name="mainarea" src="home.html">
    <frame name="footer" src="footer.html">
</frameset>

您的示例需要这样的内容:

<frameset cols="100%" rows="10%,*,10%">
  <frame name="header" src="header.htm" noresize="">

  <frameset cols="20%,80%" rows="100%">
    <frame name="sidebar" src="sidebar.htm" noresize="">
    <frame name="home" src="home.htm" noresize="">
  </frameset>

  <frame name="footer" src="footer.htm" noresize="">
</frameset>

注意:frameset无效HTML5,因为它已被弃用。我建议你研究一下获得预期效果的新方法,如果这是非常重要的,因为浏览器可能永远不会永远支持frameset