input[type="radio"] {-webkit-appearance: none; /* 브라우저 기본 스타일 제거 */-moz-appearance: none;appearance: none;width: 18px;height: 18px;border: 1px solid #d0d0d0;border-radius: 4px; /* 모서리를 살짝 둥글게 */display: inline-block;vertical-align: middle;margin-right: 5px;position: relative; background: #eee;}
input[type="radio"]:checked::after {content: '✓'; /* 체크 표시 */color: white; /* 체크 표시 색상 */font-size: 14px; /* 체크 표시 크기 */position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); /* 가운데 정렬 */line-height: 1; /* 체크 모양이 정렬될 때 필요한 값 */}
/* 선택된 라디오 버튼의 스타일 */
input[type="radio"]:checked {background-color: var(--color); border: 1px solid var(--color);}
'퍼블리싱' 카테고리의 다른 글
탭 (0) | 2025.01.10 |
---|---|
아코디언 메뉴 (0) | 2024.10.10 |
input checkbox 체크박스 커스텀 (0) | 2024.10.08 |
input date 아이콘 커스텀 (0) | 2024.10.08 |
카운트업 쓰기 (0) | 2024.03.25 |