8

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.

here is my sample code:

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

7 回答 7

22

尝试这个：

<tr>
    <td>
        Row 1
    </td>
</tr>
<tr>
    <td>
        &nbsp;
        <!--you just need a space in a row-->
    </td>
</tr>
<tr>
    <td>
        Row 2
    </td>
</tr>
于 2014-05-27T19:57:50.087 回答
10

根据 CSS 盒子模型：

边距值不适用于表格行和表格单元格
请参阅：http ://www.w3.org/TR/CSS2/box.html#margin-properties

填充和边框值不适用于表格行，但适用于表格单元格
请参阅：http ://www.w3.org/TR/CSS2/box.html#padding-properties

一个快速的解决方法是在要分隔的行的顶部添加填充。

例如：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;
}

如果要在表格单元格周围设置边框样式，则可能需要在内容周围添加包装器并根据设计细节应用边框。

于 2013-09-25T16:22:43.063 回答
4

为表格提供间距的正确方法是使用 cellpadding 和 cellspacing 例如

<table cellpadding="4">

或使用 css ：

<style type='text/css'>    
  table{ border-collapse: separate; }
  table td { border-spacing: 1em; }
</style>
于 2013-09-25T15:54:55.820 回答
4 
border spacing attribute has to be specified in CSS

table
    {
    border-collapse:separate;
    border-spacing:10px 0px;
    }

上面的代码设置行间距10px，列间距0px

于 2013-09-25T15:57:56.373 回答
2

可以这样实现。

<tr> <td> <br> </td> <!--The br tag did what i was looking for --> </tr>

于 2016-03-14T11:59:42.073 回答
1

设置标签的margin属性：<tr>

<tr style="margin-top:10px;"></tr>

或者用这种风格制作整个表格：

<style>
    table tr {
        margin-top: 10px;
    } 

    table tr:first-child {
       margin-top: 0px; !important
    }
</style>
于 2013-09-25T15:54:54.873 回答
0

对我有用的解决方案是在列级别定义 css 属性并将 colspan 定义为表中的列数

html -

<tr class="border_bottom">
    <td colspan="6"></td>
</tr>

CSS -

tr.border_bottom td {
    border-bottom: 1px solid #cccccc;
    color: #707070;
}

table{
    border-collapse: collapse;
}
于 2018-09-10T09:50:21.250 回答