移動端比1px還小的border

江文藝發表於2019-02-16

巧用border

在移動端 經常出現border,細邊框
但有的時候 產品大大1px甚至乎會覺得不夠細
那麼要如何寫出比1px還要小的border
下面是程式碼 希望對大家有所幫助


.thinner-border {
    position: relative;
    width: 1px;
    margin:14px 0;
    height: 20px;
}
.thinner-border:after {
    content: ``;
    position: absolute;
    width: 500%;
    height: 500%;
    border: 1px solid #ffd000;
    transform-origin: 0 0;
    transform: scale(0.2, 0.2);
    box-sizing: border-box;
}

相關文章