Làm cách nào để bật đường viền kép?

Question

Khi tôi gõ này:

<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> 

gì hoạt động. Giống như nó thậm chí là một hay khác. Tôi đang thiếu gì? Cảm ơn

Answer 1

Bạn có thể tạo div bên ngoài và bên trong và có thể cung cấp đường viền cho cả hai.

div { 
 
    border: 1px dashed black; 
 
} 
 

 
.outer { 
 
    padding: 5px; 
 
}

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

Answer 2

Bạn chỉ có thể khắc phục điều này với một div, bạn có thể sử dụng phác thảo và biên giới, sau đó sử dụng outline-offset tài sản

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

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

Answer 3

Không có border-style as dashed double ,
Nhưng border-style:double tài sản cho two border nhưng như solid dòng, vì vậy bạn có thể sử dụng pseudo selector và tuyên bố border-style: tiêu tan trên cả hai như dưới đây,

.tavit { 
 
    width: 400px; 
 
    height: 300px; 
 
    background-color: yellow; 
 
    border: dashed; 
 
    border-style: dashed; 
 
    margin: auto; 
 
    font-size: medium; 
 
    text-align: right; 
 
    position: relative; 
 
} 
 
    
 
.tavit:before { 
 
    content: ""; 
 
    width: 94%; 
 
    height: 280px; 
 
    border-style: dashed; 
 
    position: absolute; 
 
    left: 2%; 
 
    top: 8px; 
 
}

<div class="tavit"> 
 

 
</div>