如何擺脫表中的colspan/rowspan單元格中的行？

我試圖重新東西接近這個表：如何擺脫表中的colspan/rowspan單元格中的行？

http://i49.tinypic.com/2q2qwxl.png

我越來越怪異的線路，不過，與我已經約試圖做到這一點的方式。我如何擺脫它們？或者有人能告訴我實現上述表格中最簡單的方法嗎？這裏是我的代碼：

<!DOCTYPE html> 
<html> 
<head> 
<title>Assignment #4</title> 
<style> 

table 
    { 
font-family:"Courier New", Arial, Helvetica, sans-serif; 
border-collapse:collapse; 
margin: auto; 
border-bottom-style: double; border-top-style: double; 

    } 



table.border tr {border: 1px solid black; border-left: 0px solid; 
    border-right: 0px  solid;} 

th 
    { 
font-size:18px; 
font-style: bold; 
padding-top:2px; 
padding-bottom:2px; 
background-color:lightblue; 
color:#000000; 


    } 



    tr.white td 
    { 
color:#000000; 
background-color: #ffffff; 
    } 

td,th 
    { 
font-size:1em; 
padding:3px 7px 2px 7px; 
text-align: left; 





</style> 
</head> 

<body> 


    <body> 

<h3 style="text-align: center; font-family: courier new;"> 
<strong>Code-page support in microsoft windows</strong></h3> 

<table class="border"> 
<tr> 
    <th>Code-Page ID</th> 
    <th style="border: 1px solid black; text-align: center;">Name</th> 
    <th colspan="2">ACP OEMCP</th> 
</tr 
<div> 
<tr class="white"> 
    <td style="background-color: lightblue;" rowspan="3">1200 
     <br/>1250  
     <br/>1251</td> 

    <td style="border: 1px solid black;" rowspan="3">Unicode 
     <br/>Windows 3.1 Eastern European 

     <br/>Windows 3.1 Cynillic</td> 

    <td rowspan="3"><br/>X <br/>X</td> 

</tr> 

<tr class="white"> 

<td style="border: 1px solid black;"></td> 


</tr> 


<tr class="white"> 

<td style="border: 1px solid black;"></td> 


</tr> 

    </div> 

<div> 
<tr class="white"> 
<td style="background-color: lightblue;" rowspan="3">437 <br/>708 <br/>709</td> 
<td style="border: 1px solid black;" rowspan="3">MS-DOS 
<br/>Arabic (ASMO 708) 
<br/>Arabic (ASMO 449)</td> 
<td><br/></td> 
<td colspan="2">X <br/>X <br/>X</td> 
</tr> 

<tr class="white"> 

<td style="border: 1px solid black;"></td> 

</tr> 

<tr class="white"> 

<td style="border: 1px solid black;"></td> 

</tr> 

</div> 

<div> 
<tr class="white"> 
<td style="background-color: lightblue;">Assignment#4</td> 
<td style="border: 1px solid black;"> 
<a href="http://www.mansfield.edu">Mansfield University</a></td> 
<td colspan="2"><center> 
<img src="http://mansfield.edu/files/images/Facebook.gif"> </center></td> 
</tr> 

</div> 

</table> 




</body> 
</html>

來源

2013-04-02 Kaitlyn Hawthorne

首先將圖像樣本沒有在這裏爲我工作:(

的所有鏈接，但如果你指的是垂直線，如線路1 | 2號線是你的問題，你。可以使用列跨度= 2這將導致類似LINE1 LINE2

例：

<tr>

<td colspan=2></td> <td> </td> </tr>

希望這將有助於，

問候，

Otacon

來源

2013-04-02 02:45:01 Otacon

你的代碼是一個爛攤子！你把兩個「身體」，忘了一些「}」和「>」。除了問題是「td」是空白的，你把它放在「tr」裏面。在這裏你的代碼：

<!DOCTYPE html> 
<html> 
<head> 
<title>Assignment #4</title> 
<style> 

table { 
font-family:"Courier New", Arial, Helvetica, sans-serif; 
border-collapse:collapse; 
margin: auto; 
border-bottom-style: double; border-top-style: double; 
} 



table.border tr { 
    border: 1px solid black; 
    border-left: 0px solid; 
    border-right: 0px solid; 
} 

th{ 
font-size:18px; 
font-style: bold; 
padding-top:2px; 
padding-bottom:2px; 
background-color:lightblue; 
color:#000000; 
} 

tr.white td { 
    color:#000000; 
    background-color: #ffffff; 
} 

td,th{ 
font-size:1em; 
padding:3px 7px 2px 7px; 
text-align: left; 
} 




</style> 
</head> 

<body> 

<h3 style="text-align: center; font-family: courier new;"> 
<strong>Code-page support in microsoft windows</strong></h3> 

<table class="border"> 
<tr> 
    <th>Code-Page ID</th> 
    <th style="border: 1px solid black; text-align: center;">Name</th> 
    <th colspan="2">ACP OEMCP</th> 
</tr> 
<tr class="white"> 
    <td style="background-color: lightblue;" rowspan="3">1200 
     <br/>1250  
     <br/>1251</td> 

    <td style="border: 1px solid black;" rowspan="3">Unicode 
     <br/>Windows 3.1 Eastern European 

     <br/>Windows 3.1 Cynillic</td> 

    <td rowspan="3"><br/>X <br/>X</td> 

</tr> 

<tr class="white"> 


</tr> 


<tr class="white"> 


</tr> 
<tr class="white"> 
<td style="background-color: lightblue;" rowspan="3">437 <br/>708 <br/>709</td> 
<td style="border: 1px solid black;" rowspan="3">MS-DOS 
<br/>Arabic (ASMO 708) 
<br/>Arabic (ASMO 449)</td> 
<td><br/></td> 
<td colspan="2">X <br/>X <br/>X</td> 
</tr> 

<tr class="white"> 

</tr> 

<tr class="white"> 

</tr> 
<tr class="white"> 
<td style="background-color: lightblue;">Assignment#4</td> 
<td style="border: 1px solid black;"> 
<a href="http://www.mansfield.edu">Mansfield University</a></td> 
<td colspan="2"><center> 
<img src="http://mansfield.edu/files/images/Facebook.gif"> </center></td> 
</tr> 

</table> 
</body> 
</html>

我認爲這就是你要找的。希望這個答案幫助你。

Regards， LGhost

來源

2013-04-02 03:17:23 LGhost

如何擺脫表中的colspan/rowspan單元格中的行？

回答

相關問題