Как добавить верхние и нижние поля строки в asp.net gridview?

Question

Нет таких атрибутов, как CellPadding или CellSpacing, которые будут выполняться для меня, и когда я попытаюсь добавить css в grid tr для изменения верхнего и нижнего полей, они игнорируются. Как добавить немного расстояния между каждой сгенерированной строкой из gridview?

Answer 1

маржа не работает на table элементов, используйте padding, или как в приведенном ниже примере установить верхнюю и/или нижнюю границу на вашем tr

table { 
 
    border-collapse: collapse; 
 
} 
 
td { 
 
    background: gray; 
 
} 
 
tr { 
 
    border: 0px solid white; 
 
    border-width: 10px 0; 
 
}

<table> 
 
    <tr> 
 
    <td> 
 
     Hello there 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     Hello there 
 
    </td> 
 
    </tr> 
 
    <tr> 
 
    <td> 
 
     Hello there 
 
    </td> 
 
    </tr> 
 
</table>

Answer 2

Вы можете также достичь это с использованием

border-collapse: separate; 
border-spacing: 0 10px; 

Отрывок

table.grey-theme { 
 
    border-collapse: separate; 
 
    border-spacing: 0 10px; 
 
    margin: 50px; 
 
} 
 

 
table.grey-theme td { 
 
    border: solid #777 1px; 
 
    padding: 5px; 
 
}

<table class="grey-theme"> 
 
    <tr> 
 
    <td>Dogs</td> 
 
    <td>10</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Cats</td> 
 
    <td>20</td> 
 
    </tr> 
 
    <tr> 
 
    <td>Parrots</td> 
 
    <td>30</td> 
 
    </tr> 
 
</table>

Используйте его в asp:GridView как

<asp:GridView ID="PetGrid" runat="server" CssClass="grey-theme">