Question

我对HTML中的表格和列有一个基本问题。我想在同一页面上有两个不同的表，但每个表具有不同的列数。第一个表有六列，第二个表只有三列。现在发生的是第二个表中的列不是第一个表中的列，它们都在左边。如何处理第二个表中的三列与第一个表中的六列相同的位置？

这是我的代码，谢谢你的帮助

<html xmlns="http://www.w3.org/1999/xhtml">
   <body>
            <h2>title 1</h2>
       <table>
           <col class="number"></col>
           <col class="description"></col>
           <col class="reference"></col>
           <col class="candidate"></col>
           <col class="difference"></col>
           <col class="score"></col>
           <thead>
               <tr>
                   <th>column 1</th>
                   <th>column 2</th>
                   <th>column 3</th>
                   <th>column 4</th>
                   <th>column 5</th>
                   <th>column 6</th>
               </tr>
           </thead>
       </table>
               <h2>title 2</h2>
               <table>
                       <col class="number"></col>
           <col class="description"></col>
           <col class="diagram"></col>
                       <thead>
               <tr>
                   <th colspan="2">column 1</th>
                   <th>column 2</th>
                   <th>column 3</th>
               </tr>
           </thead>
               </table>
   </body>
</html>

CSS定义

.highlight
{
   background:#f8f6f6;
}


.clicked
{
   background:#c4c0c0;
}


h2
{
   text-align:center;
}


body
{
   font-family:Times New Roman, Georgia, Serif; font-size:14px;
}


table
{
   width:100%;
   font-size:14px;
   table-layout:auto;
   border-collapse:collapse;
   background:#FFFFFF;
}


table th
{
   font-weight:bold;
   color:#FFFFFF;
   text-align:left;
   padding:7px 15px;
   background:#373736;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#373736', endColorstr='#999a99');
   background: -moz-linear-gradient(bottom,  #999a99,  #373736);
   background: -webkit-gradient(linear, left bottom, left top, from(#999a99), to(#373736));
}


table td
{
   vertical-align:top;
   text-align:left;
   padding:7px 15px;
}

Answer 1

这里他们都集中在一起，看看：jsfiddle.net/89eZ7 /

两个表格在一页HTML中具有相同的页眉宽度和不同的列数

1 个答案: