Html 具有 100% 宽度且具有相同大小列的表格。(变量名)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/2919980/
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
Table with 100% width with equal size columns. (a variable name)
提问by Andrei Ciobanu
first of all I am not quite good at web design.
首先,我不太擅长网页设计。
I have to dynamically create a table with a variable number of columns, determined at runtime.
我必须动态创建一个列数可变的表,在运行时确定。
Can somebody tell me if it's possible to have a html table with equal size columns that are fully stretched ?
有人能告诉我是否有可能有一个完全拉伸的列大小相等的 html 表吗?
Any hints ?
任何提示?
采纳答案by Salil
<table width="400px">
<tr>
<td width="100px"></td>
<td width="100px"></td>
<td width="100px"></td>
<td width="100px"></td>
</tr>
</table>
For variable number of columns use %
对于可变数量的列使用 %
<table width="100%">
<tr>
<td width="(100/x)%"></td>
</tr>
</table>
where 'x' is number of columns
其中“x”是列数
回答by orszaczky
If you don't know how many columns you are going to have, the declaration
如果您不知道将有多少列,则声明
table-layout: fixed
table-layout: fixed
along with notsetting any column widths, would imply that browsers divide the total width evenly - no matter what.
除了不设置任何列宽外,还意味着浏览器会平均划分总宽度 - 无论如何。
That can also be the problem with this approach, if you use this, you should also consider how overflow is to be handled.
这也可能是这种方法的问题,如果你使用它,你还应该考虑如何处理溢出。
回答by aroykos
ALL YOU HAVE TO DO:
所有你需要做的:
HTML:
HTML:
<table id="my-table"><tr>
<td> CELL 1 With a lot of text in it</td>
<td> CELL 2 </td>
<td> CELL 3 </td>
<td> CELL 4 With a lot of text in it </td>
<td> CELL 5 </td>
</tr></table>
CSS:
CSS:
#my-table{width:100%;} /*or whatever width you want*/
#my-table td{width:2000px;} /*something big*/
if you have th
you need to set it too like this:
如果你有th
你需要设置它太像这样:
#my-table th{width:2000px;}
回答by S. Esteves
table {
width: 100%;
th, td {
width: 1%;
}
}
SCSS syntax
SCSS 语法