如何打破html表的两行之间的行或空格 [英] how to break a line or space in between two rows of the html table
问题描述
我需要给两个行之间的空格或间隔,以便我的页面看起来不错。
I need to give space or break between two rows, so that my page will looks good.
如果你看我的代码,我给了很多空行和列
if you look my code i had given many empty rows and column to make a space between two rows in the table.
请用任何其他正确的方式在两行之间给出空格。
Please say any other proper way to give space between two rows.
这里是我的示例代码:
<form:form name="form" method="post" modelAttribute="Abatch">
<table>
<tr>
<td>Please enter your comments</td>
<td><form:textarea id="textarea" style="width:150%;height:150%" path="Comments" size="255" readonly="false" /></td>
</tr>
<tr>
<tr>
<tr><td></td></tr>
<tr><td></td></tr>
<tr><td></td></tr>
</tr>
</tr>
<tr>
<td><input id="button1" type="submit" name="submit" value="Approve"/></td>
<td><input id="button4" type="submit" name="submit" value="Reject"/></td>
</tr>
</table>
推荐答案
根据CSS框模型:
边距值不适用于表格行和表格单元格
请参阅: http://www.w3.org/TR/CSS2/box.html#margin-properties
margin values do not apply to table rows and table cells
See: http://www.w3.org/TR/CSS2/box.html#margin-properties
padding和边框值不适用于表格行,但适用于表格单元格
请参阅: http://www.w3.org/TR/CSS2/box.html#padding-properties
padding and border values do not apply to table rows but apply to table cells
See: http://www.w3.org/TR/CSS2/box.html#padding-properties
快速修复是将填充添加到
A quick fix is to add padding to the top of the row that you want to separate.
例如: http:/ /jsfiddle.net/audetwebdesign/caXsZ/
HTML示例:
<table cellpadding="0" cellspacing="0" border="0">
<tr class="row1">
<td>Row One - 1</td>
<td>Row One - 2</td>
</tr>
<tr class="row2">
<td>Row Two - 1</td>
<td>Row Two - 2</td>
</tr>
</table>
CSS:
td {
border: 1px dotted blue;
}
tr.row2 td {
padding-top: 40px;
}
如果要对表格单元格进行样式边框,根据设计细节封装内容并应用边框。
If you want to style borders around your table cells, you may need to add wrappers around the content and apply borders depending on the design details.
这篇关于如何打破html表的两行之间的行或空格的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!