如何启用双虚线边框？

Question

当我输入这个:

   <style>
        .tavit{
            width:400px;
            height:300px;
            background-color:yellow;
            border:dashed; /*First I applied - border:dashed double (In order to get a double dashed border - but it didn't work for some reason*/
            border-style:double;
            margin:auto;
            font-size:medium;
            text-align:right;
        }
        .adom {
            color: red;
            font-size: xx-large;
            text-align: center;
        }
    </style>

什么都行不通 就像它甚至是其中一个.我错过了什么？谢谢

Answer 1

你可以简单地用一个修复它div,你可以使用轮廓和边框,然后使用outline-offset属性

.test {
  background:white;
  padding:15px;
  border:1px dashed #000;
  outline:1px dashed #000;
  outline-offset:-5px;
}

<div class="test">see this</div>

Answer 2

您可以创建外部和内部 div，并可以为它们提供边框。

div {
  border: 1px dashed black;
}

.outer {
  padding: 5px;
}

<div class="outer">
  <div class="inner">Long long long text</div>
</div>