如何增加HTML表格中列的宽度？ [英] How do I increase the width of a column in an HTML table?
本文介绍了如何增加HTML表格中列的宽度？的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
如何增加HTML表格中列的宽度？
以下是我的代码。我试图让每行中的第二个< td> 标签展开，以便输入文本框之间有更多空间（第一<< td> 标签）。有任何想法吗？
<！ - 订单信息。表格2 - >
<！ - 这是主表格中的第一个嵌套表格 - >
< table border =0width =65％cellpadding =2>
<！ - 第1行 - >
< tr>
< th colspan =3align =left>订购信息< / th>
< / tr>
<！ - 第2行 - >
< tr>
< td> QTY< / td>
< td colspan =15>< / td>
< td>小计< / td>
< td colspan =90>< input name =Gift Wrappingid =Gift Wrappingtype =checkbox/>礼品包装？ （每盒额外收费1.95美元）< / td>
< / tr>
<！ - 第3行 - >
< tr>
< td>< input name =quantityaid =quantityasize =3type =textboxvalue =0/>< / td>
< td colspan =4>< / td>
< td colspan =11align =left>巧克力坚果 - $ 10.99< / td>
< td>< input name =subtotalaid =subtotalasize =10type =textboxvalue =0/>< / td>
< td colspan =40>如果是，请注意礼品卡的文字：< / td>
< / tr>
<！ - 第4行 - >
< tr>
< td>< input name =quantitybid =quantitybsize =3type =textboxvalue =0/>< / td>
< td colspan =4>< / td>
< td colspan =11align =left>巧克力芯片 - $ 9.99< / td>
< td>< input name =subtotalbid =subtotalbsize =10type =textboxvalue =0/>< / td>
< td colspan =5>< textarea wrap =softname =giftcardtextid =giftcardtextrows =3cols =20>< / textarea><< ; / TD>
< / tr>
<！ - 第5行 - >
< tr>
< td>< input name =quantitycid =quantitycsize =3type =textboxvalue =0/>< / td>
< td colspan =4>< / td>
< td colspan =11align =left>澳洲坚果 - $ 12.99< / td>
< td>< input name =subtotalcid =subtotalcsize =10type =textboxvalue =0/>< / td>
< / tr>
<！ - 第6行 - >
< tr>
< td>< input name =quantitydid =quantitydsize =3type =textboxvalue =0/>< / td>
< td colspan =4>< / td>
< td colspan =11align =left>燕麦葡萄干 - $ 10.99< / td>
< td>< input name =subtotaldid =subtotaldsize =10type =textboxvalue =0/>< / td>
< / tr>
<！ - 第7行 - >
< tr>
< td>< input name =quantityeid =quantityesize =3type =textboxvalue =0/>< / td>
< td colspan =4>< / td>
< td colspan =11align =left> Chocolate Dessert - $ 10.99< / td>
< td>< input name =subtotaleid =subtotalesize =10type =textboxvalue =0/>< / td>< / td>
< td>发货：< / td>
< td colspan =30>< / td>
< td colspan =150> $ 5.95 for 1-5 boxes，$ 10.95 for five boxes and more boxes< / td>
< / tr>
<！ - 第8行 - >
< tr>
< td><输入名称=quantityfid =quantityfsize =3type =textboxvalue =0/>< / td>
< td colspan =4>< / td>
< td colspan =11align =left>黄油 - $ 7.99< / td>
< td>< input name =subtotalfid =subtotalfsize =10type =textboxvalue =0/>< / td>< / td>
< td>总计：< / td>
< td colspan =30>< / td>
< td colspan =1>< input name =totalaid =totalasize =3type =textboxvalue =0.00/>< / td>
< / tr>
<！ - 第9行 - >
< tr>
< td colspan =0>< / td>
< td colspan =4>< / td>
< td colspan =11align =left>小计< / td>
< td>< input name =subtotalgid =subtotalgsize =10type =textboxvalue =0/>< / td>< / td>
< / tr>
< / table>
解决方案
您可以按像素或百分比来完成：
< TABLE BORDER =2CELLPADDING =2CELLSPACING =2WIDTH =300>
< TR>
< TD WIDTH =100>第1栏< / TD>
< TD WIDTH =200>第2栏< / TD>
< / TR>
< / TABLE>
或
< TABLE BORDER =2CELLPADDING =2CELLSPACING =2WIDTH =100％>
< TR>
< TD WIDTH =25％>第1栏< / TD>
< TD WIDTH =75％>第2栏< / TD>
< / TR>
< / TABLE>
How do I increase the width of a column in an HTML table?
Below is my code. I am trying to get the second <td> tag in each row to expand so that there is more space between the input text box (1st <td> tag) and the name of the cookie and it's price (3rd <td> tag). Any ideas?
<!--Order Info. table -nested table 2 -->
<!--This is the first nested table within the main table -->
<table border="0" width="65%" cellpadding="2">
<!--Row 1 -->
<tr>
<th colspan="3" align="left">Order Information</th>
</tr>
<!--Row 2 -->
<tr>
<td>QTY</td>
<td colspan="15"></td>
<td>Subtotal</td>
<td colspan="90"><input name="Gift Wrapping" id="Gift Wrapping" type="checkbox" /> Gift wrapping? (Additional charge of 1.95 per box)</td>
</tr>
<!-- Row 3 -->
<tr>
<td><input name="quantitya" id="quantitya" size="3" type="textbox" value="0"/></td>
<td colspan="4"></td>
<td colspan="11" align="left">Chocolate Nut - $10.99</td>
<td><input name="subtotala" id="subtotala" size="10" type="textbox" value="0"/></td>
<td colspan="40">If yes, note the text for the gift card:</td>
</tr>
<!-- Row 4 -->
<tr>
<td><input name="quantityb" id="quantityb" size="3" type="textbox" value="0"/></td>
<td colspan="4"></td>
<td colspan="11" align="left">Chocolate Chip - $9.99</td>
<td><input name="subtotalb" id="subtotalb" size="10" type="textbox" value="0"/></td>
<td colspan="5"><textarea wrap="soft" name="giftcardtext" id="giftcardtext" rows="3" cols="20" ></textarea></td>
</tr>
<!--Row 5 -->
<tr>
<td><input name="quantityc" id="quantityc" size="3" type="textbox" value="0"/></td>
<td colspan="4"></td>
<td colspan="11" align="left">Macadamia Nut - $12.99</td>
<td><input name="subtotalc" id="subtotalc" size="10" type="textbox" value="0"/></td>
</tr>
<!--Row 6 -->
<tr>
<td><input name="quantityd" id="quantityd" size="3" type="textbox" value="0"/></td>
<td colspan="4"></td>
<td colspan="11" align="left">Oatmeal Raisin - $10.99</td>
<td><input name="subtotald" id="subtotald" size="10" type="textbox" value="0"/></td>
</tr>
<!--Row 7 -->
<tr>
<td><input name="quantitye" id="quantitye" size="3" type="textbox" value="0"/></td>
<td colspan="4"></td>
<td colspan="11" align="left">Chocolate Dessert - $10.99</td>
<td><input name="subtotale" id="subtotale" size="10" type="textbox" value="0"/></td></td>
<td>Shipping:</td>
<td colspan="30"></td>
<td colspan="150">$5.95 for 1-5 boxes, $10.95 for five or more boxes</td>
</tr>
<!--Row 8 -->
<tr>
<td><input name="quantityf" id="quantityf" size="3" type="textbox" value="0"/></td>
<td colspan="4"></td>
<td colspan="11" align="left">Butter - $7.99</td>
<td><input name="subtotalf" id="subtotalf" size="10" type="textbox" value="0"/></td></td>
<td>Total:</td>
<td colspan="30"></td>
<td colspan="1"><input name="totala" id="totala" size="3" type="textbox" value="0.00" /></td>
</tr>
<!--Row 9 -->
<tr>
<td colspan="0"></td>
<td colspan="4"></td>
<td colspan="11" align="left">Subtotal</td>
<td><input name="subtotalg" id="subtotalg" size="10" type="textbox" value="0" /></td></td>
</tr>
</table>
解决方案
You can do it in pixels or as a percentage:
<TABLE BORDER="2" CELLPADDING="2" CELLSPACING="2" WIDTH="300">
<TR>
<TD WIDTH="100">Column 1</TD>
<TD WIDTH="200">Column 2</TD>
</TR>
</TABLE>
or
<TABLE BORDER="2" CELLPADDING="2" CELLSPACING="2" WIDTH="100%">
<TR>
<TD WIDTH="25%">Column 1</TD>
<TD WIDTH="75%">Column 2</TD>
</TR>
</TABLE>
这篇关于如何增加HTML表格中列的宽度？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
