html写网页怎样布局-百分百源码网

html写网页怎样布局

发布时间：09/01 来源：未知浏览：关键词：

html常用的规划有两种。第一种一是div规划，长处是比力利便简约，代码比力少，制作和保护也比力容易，就是有些地方不一样的阅读器兼容性不一样，大概会有不一样的显示。第二种是table规划，代码比力多，到后期保护起来是非常头疼的，但是table规划躲避了很多阅读器不兼容的问题。

1.div规划

<!DOCTYPE html>  
<html>  
<head lang="en">  
    <meta charset="utf-8">  
    <title></title>  
    <style>  
        body{margin: 0; padding: 0;}  
        #header{width:100%; height: 90px; background: #b19f9d; }  
        #nav{margin: 0 auto; width:70%; height: 90px; background: #fcf;}  
        .content{width: 950px; height: 900px; background: #847369; margin: 0 auto;}  
        .left{width:30%; height: 900px; background: #decfd4; float: left;}  
        .right{width: 70%; height: 900px; background: #b3a19d; float: left;}  
        footer{width:100%; height: 150px; background: #a8817a;}  
    </style>  
</head>  
  
<body>  
    <header id="header">  
        <nav id="nav">空空</nav>  
    </header>  
    <div class="content">  
        <div class="left"></div>  
        <div class="right"></div>  
    </div>  
    <footer></footer>  
</body>  
  
  
</html>

2.table规划

<!DOCTYPE html>  
<html>  
<head lang="en">  
    <meta charset="utf-8">  
    <title></title>  
    <style>  
          
    </style>  
</head>  
  
<body marginheight="0px" marginwidth="0px">  
    <table width="100%" height="950px" style="background-color:gray">  
        <tr>  
            <td colspan="2" width="100%" height="10%" style="background-color: aqua" ><td>  
        </tr>  
        <tr>  
            <td  width="20%" height="80%" style="background-color: blue" ><td>  
            <td  width="80%" height="80%" style="background-color: blue" ><td>  
        </tr>  
        <tr>  
            <td colspan="2" width="100%" height="10%" style="background-color: black" ><td>  
        </tr>  
      
    </table>  
</body>  
  
  
</html>

总结：

table规划比力局限，div 比力开放，设计样式比力多，结果美妙，table好处是所有阅读器都兼容div缺陷是兼容性很费事。

相关引荐：

HTML规划之运算器(div+css)_html/css_WEB-ITnose

html规划的问题。_html/css_WEB-ITnose

HTML规划_html/css_WEB-ITnose

html规划问题_html/css_WEB-ITnose

以上就是html写网页怎样规划的具体内容，更多请关注百分百源码网其它相关文章！

打赏