Html 制作带有垂直列的表格
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/8699098/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Html making a table with vertical columns
提问by Night Walker
I am trying to make a table with vertical columns ,
我正在尝试制作一个带有垂直列的表格，
Is my code makes it how it should implemented ?
我的代码是否使它应该如何实现？
<table border="1" cellpadding="5" cellspacing="5" width="100%" style="background color:white;">
<tr>
<th >Table header</th>
<td>Table cell 1</td>
<td>Table cell 2</td>
</tr>
</table>
回答by Pavan
Try something like below to get multiple rows with multiple columns
尝试类似下面的方法来获得多行多列
<table border="1" cellpadding="5" cellspacing="5" width="100%"
style="background color:white;">
<tr>
<th>Header Name1</th>
<th>Header name2</th>
</tr>
<tr>
<td>Row 1 Column 1</td>
<td>Row 2 Column 2</td>
</tr>
<tr>
<td>Row 2 Column 1</td>
<td>Row 2 Column 2</td>
</tr>
</table>
You have to add a separate tr tag for each row.
您必须为每一行添加一个单独的 tr 标签。
回答by Mahmoud Gamal
To create a table with multiple vertical columns and multiple rows you need to structure your table as a set of <tr>'s the first is the table header, each <td>in this header is a column header cell and the following <tr>'s are the rows like this:
要创建具有多个垂直列和多行的表格，您需要将表格构建为一组<tr>'s，第一个是表格标题，<td>此标题中的每个是一个列标题单元格，以下<tr>'s 是这样的行：
<table border="1" cellpadding="5" cellspacing="5" width="100%" style="background color:white;">
<tr>
<th>Column1</th>
<th>Column2</th>
<th>Column3</th>
</tr>
<tr>
<td>Row 1 Column 1</td>
<td>Row 1 Column 2</td>
<td>Row 1 Column 3</td>
</tr>
<tr>
<td>Row 2 Column 1</td>
<td>Row 2 Column 2</td>
<td>Row 2 Column 3</td>
</tr>
</table>
See this Fiddle
看到这个小提琴
