我有这个按钮边框动画,当按钮不圆角时可以正常工作。如果按钮的边框半径为 9px,如何才能达到相同的效果。我无法让动画在不打破右边框的情况下正确工作。
body {
font-family: sans-serif;
background-color: black;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.button {
position: relative;
width: 200px;
height: 40px;
background-color: #083a65;
border: none;
color: white;
font-size: 18px;
border-radius: 10px;
}
.button::before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 0;
height: 0;
border-radius: 10px;
border-top: 1px solid yellow;
border-right: 1px solid yellow;
animation: border-top-right-animation 2s infinite;
}
.button::after {
content: "";
position: absolute;
right: 0px;
bottom: 0px;
width: 0;
height: 0;
border-radius: …Run Code Online (Sandbox Code Playgroud)css ×1