如何在gridview的行之间添加边距答案

【问题标题】：How to add margins between rows of gridview如何在gridview的行之间添加边距
【发布时间】：2017-02-13 11:50:18
【问题描述】：

我有一个 gridview，我正在尝试使用 CSS 在每行之间添加空白空间。

这不起作用：

#gridview tr{
    margin-bottom: 10px;
}

这也不行：

#gridview td{
    margin-bottom: 10px;
}

搞乱“border-collapse”也无济于事。

有人知道如何添加间距吗？

【问题讨论】：

标签： css gridview

【解决方案1】：

Margin 不适用于应该使用border 或padding 的表格元素，如下面的sn-p

table.grid 
{
  border-collapse: collapse; 
}    

table.grid tr 
{
      border: 0px solid white;
      border-width: 20px 0;
}

<table class="grid ">
  <tr>
    <td>
      Row 1
    </td>  
  </tr>  
  <tr>
    <td>
      Row 2
    </td>  
  </tr>   
</table>

您可以像这样在GridView 中使用它：

<asp:GridView ID="PetGrid" runat="server" CssClass="grid">

【讨论】：

【解决方案2】：

使用填充：

#gridview td{
     padding-bottom: 10px;
}

【讨论】：

【解决方案3】：

在 th 和 td 中使用填充，

    th, td {
    padding: 15px;

}

【讨论】：

【解决方案4】：

试试这个

table td {
	border-bottom: solid 20px transparent;
}

<table>
<tr>
	<td>Content</td>
</tr>
<tr>
	<td>Content</td>
</tr>
</table>

【讨论】：

【解决方案5】：

您使用的是哪个网格视图？尝试在网格行上“检查元素”并检查样式从哪个 .css 类继承。尝试更改一些参数，如 padding/row height 并观察是否可行，并在网格的库 css 中进行更改或使用自定义类覆盖它。

【讨论】：

【解决方案6】：

#gridview tr{
{

  height: 18px;text-align: left;font-weight: bold;color:white;padding: 5px 6px 2px;border-bottom: 2px solid #666666;white-space: nowrap;


}

【讨论】：

【解决方案7】：

在规范中，margin 被表格单元格忽略：Link

尝试使用padding

#gridview td{
   padding-bottom: 10px;
}

【讨论】：