셀렉트
정해진 목록에서 하나를 고를 때. 선택지가 5개 이하이고 한눈에 보여야 하면 라디오가 낫습니다.
코드
<label class="jt-label" for="proc" data-required>공정 구분</label>
<select class="jt-select" id="proc">
<option>충진</option>
<option>포장</option>
</select>하지 말 것
- 직접 만든 드롭다운으로 교체하지 마세요. 네이티브
<select>는 모바일에서 OS 선택 UI가 뜨고, 키보드·스크린리더가 자동으로 동작합니다. 직접 만들면 이게 전부 깨집니다. - 선택지가 20개를 넘으면 셀렉트가 아니라 검색 필드를 고려하세요.
접근성
<label>을for로 연결하거나aria-label을 주세요- 필수 항목은
<label class="jt-label" data-required>
앱에서 모양 바꾸기
jt-utilities.css를 고치지 말고 아래 변수만 덮어쓰세요(컴포넌트 계약).
노브: 입력과 같은 --control-height를 씁니다
.my-page .jt-select { 입력과: …; }