-8

我的代码是这样的:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
   "http://www.w3.org/TR/html4/frameset.dtd">
<html>
    <head>
        <title>
            Prueba
        </title>
    </head>
    <frameset rows="56px, *, 50px" border="0" framespacing="0" frameborder="NO">
        <frame class="header" src="header.html">
        <frameset cols="450px, *" border="0" framespacing="0" frameborder="NO">
            <frameset rows="*,150px" border="0" framespacing="0" frameborder="NO">
                <frame class="frame1" scrolling="auto" src="search_results.html">
                <frame class="frame2" scrolling="no" src="info.html">
            </frameset>
            <frame class="frame3" scrolling="no" src="map.html">
        </frameset>
        <frame class="footer" scrolling="no" src="footer.html">
    </frameset>
</html>

我想删除所有框架并用表格重建它。我试图做某事,但我没有得到我想要的结果。

4

2 回答 2

6
<table>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN"
   "http://www.w3.org/TR/html4/frameset.dtd">
<html>
    <head>
        <title>
            Prueba
        </title>
    </head>
    <frameset rows="56px, *, 50px" border="0" framespacing="0" frameborder="NO">
        <frame class="header" src="header.html">
        <frameset cols="450px, *" border="0" framespacing="0" frameborder="NO">
            <frameset rows="*,150px" border="0" framespacing="0" frameborder="NO">
                <frame class="frame1" scrolling="auto" src="search_results.html">
                <frame class="frame2" scrolling="no" src="info.html">
            </frameset>
            <frame class="frame3" scrolling="no" src="map.html">
        </frameset>
        <frame class="footer" scrolling="no" src="footer.html">
    </frameset>
</html>
</table>

那里。


但是很严重。您不想使用表格进行布局。你也不应该使用框架。

要走的路是使用div。或者新的 HTML5 元素。

添加到 HTML 的一些新元素是:

部分元素

  • 部分
  • 导航
  • 文章
  • 在旁边
  • 标题
  • 页脚
  • 地址

分组元素

  • 数字
  • 无花果

不使用表格进行布局时的一些好处:

  • 表格呈现速度较慢
  • 使用流体设计时,表格效果不佳
  • 表格不是用于布局的正确语义元素
  • 表格用于表格数据
  • 如果您想在某些时候更改布局,表格并不是很灵活

请注意,当您想使用新的 HTML5 元素时,您应该设置正确的文档类型:

<!DOCTYPE html>

另请注意,“旧”浏览器(和 IE)不知道新元素。要解决此问题,您可以在文档头部添加这个简单的 JS 脚本:

<script>
  document.createElement('header');
  document.createElement('nav');
  document.createElement('section');
  document.createElement('article');
  document.createElement('aside');
  document.createElement('footer');
  document.createElement('time');
</script>

你会得到如下内容:

CSS

​#body { width: 960px; }
aside { width: 450px; float: left; }
.content { margin-left: 450px; }

HTML

<div id="body">
    <header>
        <h1>Your header</h1>
    </header>
    <aside>
        <p>Aside</p>
    </aside>
    <div class="content">
        <h2>Title</h2>
        <p>Some text</p>
    </div>    
    <footer>
        <p>Your footer</p>
    </footer>
</div>    ​

演示

http://jsfiddle.net/ZGPAW/

于 2012-05-14T18:43:03.853 回答
1

您无法使用表格复制框架的功能。如果您有重建站点的理由,最好从头开始,包括有关功能、总体布局和使用的服务器端技术的决策。

于 2012-05-14T20:09:36.403 回答