Question

我在选择表格单元时遇到问题。

我将表格单元格定义为具有以下度量：

 cell 1: 220px
 cell 2: 315px
 cell 3: 265px
 cell 4: 200px
 Adds to 1000px

在浏览器中打开表格时获得的测量结果：

     cell 1: 190px
     cell 2: 264px
     cell 3: 222px
     cell 4: 168px
     Adds to 844px

请注意，我没有设置表格的宽度。除了该表之外，页面上还没有其他元素。为什么会这样？

Answer 1

试试这个：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
   <head>
      <style type="text/css" media="screen">
         table { border-collapse: collapse; table-layout: fixed }
         td { padding: 0; border: 1px solid black }
      </style>
   </head>
   <body>
      <table>
         <col width="220" />
         <col width="315" />
         <col width="265" />
         <col width="200" />
         <tbody>
            <tr>
               <td>col 1</td>
               <td>col 2</td>
               <td>col 3</td>
               <td>col 4</td>
            </tr>
         </tbody>
      </table>
   </body>
</html>

col是用于layout the table cells的合法元素。

在上面的示例中，Firebug将显示单元格的宽度，其中所需的大小（以像素为单位）减去1px的边框（将折叠）。整个表格将是1000px宽。

Answer 2

我们真的需要更多代码来评估这一点。请创建一个演示js-fiddle。

您是否在表格本身上使用了样式规则：table-layout:fixed; border-collapse: collapse;以及属性：border="0" cellpadding="0" cellspacing="0"？您是否还将目标总表宽度设置为1000px？

Answer 3

设置表格的宽度，广告你会得到正确的结果。

See this fiddle.

设置表格单元格的宽度

3 个答案: