둥근 모서리가 둥글 둥글하지 않고

Question

모서리가 둥근 버튼이 추가되었습니다. 원 버튼으로 조금 흐려질 것입니다.

.btn { 
 
    border: 1px solid #4278ae; 
 
    display: inline-block; 
 
    vertical-align: middle; 
 
    padding: 10px; 
 
    margin: 10px; 
 
    border-radius: 100%; 
 
}

<a href="#" class="btn">Test</a>

나는이 평평하고 매끄러운과 같이합니다. 내가 어떻게 이걸 얻을 수 있니?

Answer 1

1px은 우리 눈에 보이지 않습니다. 코드에는 문제가 없지만 더보기 좋게하려면 2px을 사용할 수 있습니다.

는 픽셀이 같은 일을 아시는 바와 같이

,

따라서 우리는 곡선이 명확 /하지 부드러운 경우로를 참조하십시오.

.btn { 
 
    border: 2px solid #4278ae; 
 
    display: inline-block; 
 
    vertical-align: middle; 
 
    padding: 10px; 
 
    margin: 10px; 
 
    border-radius: 100%; 
 
}

<a href="#" class="btn">Test</a>

국경 대신에

Answer 2

사용 상자 - 그림자 속성 :

border: 1px solid #4278ae; 

그것은 더 명확 보이는

대신에

box-shadow: 0px 0px 3px 0px #4278ae;