Question

当我在表格行中设置时，边框半径不起作用。我希望每行的角都是圆的。

<table style="border-spacing: 0 8px; border-collapse: separate;">
                    <tbody>
                        @foreach (var item in Model.project)
                        {
                            @:<tr style="background-color:grey;-moz-border-radius: 15px;border-radius: 15px;">
                            <td class="position">@item["position"]</td>                                
                            <td class="image">
                                <img src="@item["image"]" />
                            </td>
                            <td class="name">@item["name"]</td>                              
                            @:</tr>
                        }
                    </tbody>
                </table>

Answer 1

我不知道@的所有代码是什么，我把它留在代码中并修复了其余部分：

HTML：

<table style="border-spacing: 0 8px; border-collapse: separate;">
    <tbody>
    @foreach (var item in Model.project) {
        @:<tr>
            <td class="position">@item["position"]</td>                                
            <td class="image">
            <img src="@item["image"]" />
            </td>
            <td class="name">@item["name"]</td>                              
        @:</tr>
    }
    </tbody>
</table>

CSS：

tbody > tr td {
    background-color:grey;
    -moz-border-radius: 15px;
    border-radius: 15px;
}

JSFiddle demo

Answer 2

尝试使用此css表 -

table {border-collapse:separate;}
tr:first-child td:first-child {border-top-left-radius:15px;}
tr:first-child td:last-child {border-top-right-radius:15px;}
tr:last-child td:first-child {border-bottom-left-radius:15px}
tr:last-child td:last-child {border-bottom-right-radius:15px;}
td {border:1px solid #000; background-color:#ccc}

边界半径不适用于每一行

2 个答案: