css – 如何制作虚线霓虹灯边框?

我做了一个霓虹灯边框https://jsfiddle.net/cf3cec6c/

    body{background:black;}
    h1 {
        color: white;
    }
    .wrapper{
    position: reltive;
     z-index: 999;             
        border:1px solid red;
        margin-top: 10px;
        margin-bottom: 10px;
        margin-right: 10px;
       
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    
      border: 3px solid #0cd808;
     box-shadow: 0 0 1px #b3ff51, 0 0 2px #b3ff51, 0 0 6px #b3ff51, 0 0 12px #b3ff51, inset 0 0 1px #b3ff51, inset 0 0 2px #b3ff51, inset 0 0 6px #b3ff51, inset 0 0 12px #b3ff51;
    
    }
    <div class="wrapper">
      <h1> hello hello hello hello
        hello hello hello hello
        hello hello hello hello
        hello hello hello hello
        <br>
         hello hello hello hello
        hello hello hello hello
        hello hello hello hello
        hello hello hello hello
        <br>
         hello hello hello hello
        hello hello hello hello
        hello hello hello hello
        hello hello hello hello
      </h1>
    </div>

我怎么能把它做成这样的点缀:
image of a motel/club sign with a thick red border with white, circular lights spaced inside of it

最佳答案
请试试这个:

.wrapper {
    border: 6px dotted #0cd808;
}

转载注明原文:css – 如何制作虚线霓虹灯边框? - 代码日志