css button with double border定期邊境+使用CSS
我想acheive上面的按鈕同樣的邊界效應抵消按鈕邊框。
我能得到的最接近的是下面的,但在底邊框的右下角不正確四捨五入:
>
.login__button {
background: transparent;
border: none;
border-width: 2px 1px 2px 2px;
border-style: solid;
border-color: pink;
border-radius: 4px;
color: pink;
margin-bottom: 100px;
position: relative !important;
text-transform: uppercase;
height: 33px;
width: 102px;
box-shadow:
3.5px 4px 0px black,
1.5px 0px 0px pink,
3.5px 4px 0px black,
2px 6px 0px pink;
}
.login__button::before {
background: pink;
content: '';
position: absolute;
height: 35px;
width: 3.0px;
border-radius: 3px;
top: 3%;
right: -2.8px;
}
>
我覺得這應該是可能只使用盒子陰影,但似乎沒有辦法修改盒子陰影的寬度以恰當地得到黑色部分插入。
你是一個救星! –