忽略盘旋的边界的梯度背景

Question

我有3个css课程。

.gradiented_block_gray{
    border-collapse: collapse;
    background: -webkit-linear-gradient(white, rgb(220, 220, 220));
    background: -o-linear-gradient(white, rgb(220, 220, 220));
    background: -moz-linear-gradient(white, rgb(220, 220, 220));
    background: linear-gradient(white, rgb(220, 220, 220));
    border: solid;
    border-color: #dcdcdc;
    border-width: 1px;
    width: 100%;
}

.gradiented_block_blue{
    border-collapse: collapse;
    background: -webkit-linear-gradient(rgb(0, 111, 174), rgb(80, 149, 207));
    background: -o-linear-gradient(rgb(0, 111, 174), rgb(80, 149, 207));
    background: -moz-linear-gradient(rgb(0, 111, 174), rgb(80, 149, 207));
    background: linear-gradient(rgb(0, 111, 174), rgb(80, 149, 207));
    width: 100%;
}

.circled_border{
    -webkit-border-radius: 5px; 
    -moz-border-radius: 5px; 
    border-radius: 5px; 
}

我正在使用

<table class="gradiented_block_gray circled_border" style="border: none">
    <tr>
        <td class="gradiented_block_blue">

不试图让td呈蓝色渐变，它可以正常工作 桌子的下边缘仍然盘旋，但是上面是方形的 我想把上边缘也圈起来。
这是怎么样的

Answer 1

尝试将border-radius添加到gradiented_block_blue。 （但只在顶部）