선 그리는 방법
1. padding, margin 조절. (적절하지 않음. XXX)


2. 가상 요소 사용하기
.menu-option {
position: relative; /* 가상 요소의 절대 위치를 위한 상대 위치 지정 */
&:not(:last-child)::after {
content: '';
position: absolute;
bottom: 0;
left: 10px;
right: 10px;
border-bottom: 1px solid #ddd; /* 원하는 색상으로 변경 */
}
}
.option-button {
width: 100%;
padding: 10px;
&:hover {
background-color: #e0e0e0;
}
&:focus {
background-color: #e0e0e0;
}
}


'프로젝트' 카테고리의 다른 글
[PBL] npx와 npm 차이 (0) | 2024.10.27 |
---|---|
[PBL] 트러블슈팅 ESLint 9.0.0 (0) | 2024.10.24 |
[PBL] .editorconfig vs .prettierrc.js vs .eslintrc.js (0) | 2024.10.23 |
[PBL] 템플릿 vs 보일러플레이트 (0) | 2024.10.23 |
[해양물류] 모달창 구현 시 UX/접근성/스크린 리더 고려. (0) | 2024.09.28 |