2013-02-10 121 views
0

我想格式化一張表,看起來像這樣...格式HTML表格標題

基本上我想「日期」行有兩列(來回)他們兩個50%的日期的寬度...但是當我嘗試格式化它。 「To」取所有日期和「From」取所有名稱。他們arent在 「日期」

任何幫助將不勝感激...謝謝鎖定enter image description here

    <th width="100%">Dates</th><th>Name</th><th>Age</th> 
     <tr> 
    <tr> 
    <td width="50%">To</td> 
    <td width="50%">From</td> 
    </tr> 

</tr> 

變化

<table border="1"> 
         <tr class="heading"> <td colspan="6">Information</td> </tr > 
        <th width ="15" colspan="2">Dates</th><th> Name</th><th>Age</th> 
     <tr> 
    <tr> 
    <td width="2">From</td> 
    <td width="2">To</td> 
    <td></td> 
    <td></td> 
    </tr> 
    <tr> 
    <td width="5"> 
    <input type="text" class="input" name="1fdate" /></td> 
    <td width="2"> 
    <input type="text" class="input" name="1fdate" /></td> 

    </tr> 


</tr> 




        </table> 
+0

您可以顯示更多的數據?您可能還需要使用/ ',並使用headers屬性以及Back的建議,以便表可以訪問。 – 2013-02-10 04:11:35

回答

1

我希望這是你所需要的。您使用colspanrowspan合併單元格。當您在日期單元格中將colspan設置爲「2」時,它將跨越具有兩個單元格(或柱)的行。而且你還設置了細胞的rowspan旁邊的日期爲「2」,使他們將跨越通過全日期部分採取的行。

<table width="600" border="0"> 
    <tr> 
    <th width="200" colspan="2" scope="col">Date</th> 
    <th width="200" rowspan="2" scope="col">Name</th> 
    <th width="200" rowspan="2" scope="col">Age</th> 
    </tr> 
    <tr> 
    <th width="100">To</th> 
    <th width="100">From</th> 
    </tr> 
    <tr> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    </tr> 
    <tr> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    <td>&nbsp;</td> 
    </tr> 
</table> 
+0

肯定是好的......甚至完美...但是當我更換&NBSP與 它橫跨它...比我想要的寬得多,並設置寬度 does not fix it or make it smaller – kemnet 2013-02-10 05:29:30

+0

@kemnet在細胞,<輸入大小= 「14」/>非常吻合。請注意,這些數字不是相同的單位。所以你可以使用CSS,這更好。所以 and 完美契合。無需處理寬度和尺寸了! :) – 2013-02-10 05:47:12

0

替換第一線下方

   <th width="100%" colspan="2">Dates</th><th>Name</th><th>Age</th> 
1

變化

<th width="100%">Dates</th> 

colspan值。像

<th colspan="2">Dates</th> 
+0

例如:http://jsfiddle.net/BRckD/ – uberdanzik 2013-02-10 04:19:03

+0

日期名稱年齡 從 – kemnet 2013-02-10 04:19:05

+0

這使得一個好一點...謝謝 – kemnet 2013-02-10 04:36:42