可以同时具有border-radius和border属性吗？

Question

我试图将边框半径和实线边框应用于表，但是border属性似乎抵消了边框半径。这是一个已知问题还是我只是搞砸了？

border-radius: 15px 15px 15px 0;border: 2px solid #000000;

Answer 1

尝试使用容器：

.table-container {
  border: 2px solid #000;
  border-radius: 15px 15px 15px 0;
  overflow: hidden;
}

然后包装<table> ...

<div class='table-container'>
  <table> ... </table>
</div>

Answer 2

我认为您的HTML表结构错误，或者您无法正确应用CSS。

尝试一下：

HTML

<table>
        <tr>
            <th>
                Name
            </th>
            <th>
                Address
            </th>
            <th>
                Contact
            </th>
        </tr>
        <tr>
            <td>
                Nayeem
            </td>
            <td>
                Khulna
            </td>
            <td>
                9812979832
            </td>
        </tr>
    </table>

CSS

table{
        border-radius: 15px 15px 15px 0;
        border: 2px solid black;
    }