box-shadow1 CSS - border 뾰족한 대각선 모서리 채워넣기 (feat.box-shadow) 탭 버튼을 클릭했을 때, 굵게 표시된 테두리 영역을 자세히 보면 edge가 대각선으로 뾰족하게 나와있다. 멀리서보면 잘 티가 안나지만, 확대해보면 여간 신경쓰이는 게 아니다. 이때 대각선으로 뾰족하게 보이는 edge 를 예쁘게 펴봤던 과정을 포스팅으로 정리해보았다. 결과화면 미리보기 CSS 테두리가 있는 박스 안에서 생긴 이슈이기 때문에 box-shadow 를 사용해보았다. box-shadow 는 요소의 테두리에 그림자 효과를 준다. 박스 요소 바깥은 물론 박스 안에도 그림자 효과를 줄 수 있다. box-shadow 의 inset 옵션을 사용을 사용하여 요소 안에 그림자 효과를 넣어 뾰족한 edge 를 채워넣었다. .tab-items .item { width: 100%; height: 77px; } .t.. 2022. 6. 30. 이전 1 다음 반응형
