border-color：rgba（）边界在角落重叠，给出比预期暗的颜色

<div>

<div class=\"opacity-wrapper\">
  <div class=\"transparent-border\">Foo</div>
</div>

.transparent-border {
    width:300px;
    font-size: 40px;
    padding: 10px;

    text-align: center;

    border:30px solid;
    border-color:rgb(0,0,0);
    border-color:rgba(0,0,0, 0.7);

    margin-bottom: 10px;
}

.opacity-wrapper {
    background-color: rgb(0, 0, 0);
    opacity: 0.7;

    padding: 30px;
    width:320px;
}

.opacity-wrapper div {
    padding: 10px;
    background-color: rgb(255, 255, 255);
    color: rgb(0, 0, 0);

    font-size: 40px;
    text-align: center;
}

border-spacing

table
{
    border-collapse: separate;
    border-spacing: 0;
}

table td:not(:last-child)
{

}

element{
    width:300px;
    border:9px solid;
    border-top-color: rgba(0,0,0, 0.7);
    border-bottom-color: rgba(0,0,0 0.7);
    border-right-color: rgba(1,1,1, 0.7);
    border-left-color: rgba(1,1,1 0.7);
}

box-shadow: 0 0 0 9px rgba(0, 0, 0, 0.7);