嵌套表格总是出错

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8">
</head>
    <body>
        <table width="100%" align="center">
       <tr height="80px" bgcolor="pink">
           <td>页头</td>
       </tr>
       <tr height="10px"><td></td></tr>
       <tr><td>
           <table align="center" width="1024px">
               <tr>
                  <td width="240px"  valign="top">
                    <table width="100%" bgcolor="orange" align="center">
                    <tr>
                                
                <td align="center" width="240px"></td>
                <td align="center" width="20px">左侧内容</td>
                <td align="center" width="764px">右侧内容</td>
                    </tr>
                            
                </table>
 
                  </td>
                  <td width="20px"></td>
                  <td width="764px" bgcolor="#ffffff">
                  
                  </td>
               </tr>
           </table>
 
       </td></tr>
       <tr height="10px"><td></td></tr>
       <tr height="80px" bgcolor="black"><td></td></tr>
 
     </table>
 
    </body>
</html>

打不死的女小强 2017-11-25

源自：HTML表格 3-4 编程练习

收起

1回答

好帮手慕糖回答被采纳获得+3积分 2017-11-26 15:56:14

你好，这里的嵌套一个表格就可以了，不需要嵌套另个，而且如下图，宽度240px，那么包裹的表格就一共是240px,但是下面三个列的宽度240px;20px；764px;这是不合理的哦。建议：修改可参考如下代码：

<table width="100%" align="center">
     <tr height="80px" bgcolor="pink">
        <td>页头</td>
     </tr>
     <tr height="10px"><td></td></tr>
     <tr>
         <td bgcolor="orange">
             <table  align="center">
                <tr>
                    <td width="240px" bgcolor="#fff">左侧内容</td>
                    <td width="20px"></td>
                    <td width="764px" bgcolor="#fff">右侧内容</td>
                </tr>
            </table>
        </td>
    </tr>
    <tr height="10px"><td></td></tr>
    <tr height="80px" bgcolor="black"><td></td></tr>
</table>