0

我正在尝试重新创建靠近此表的内容:

不过,随着我尝试这样做的方式,我得到了奇怪的线条。我该如何摆脱它们?或者有人可以告诉我实现上图所示表格的最简单方法吗?这是我的代码:

<!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>
4

2 回答 2

0

首先,图像样本的链接对我来说在这里不起作用:(

但是如果你的意思是像 line1|line2 这样的垂直线是你的问题,你可以使用 colspan=2。这将导致类似于 line1 line2 的内容。

例子:

<tr>

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

希望会有所帮助,

问候,

奥塔康

于 2013-04-02T02:45:01.273 回答
0

你的代码是一团糟!你放了两个“body”,忘记了一些“}”和“>”。除了问题是您放在“tr”中的空白“td”。这里有代码:

<!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>

我想这就是你要找的。希望这个答案对你有所帮助。

问候, LGhost

于 2013-04-02T03:17:23.063 回答