<label>
<input type="radio" name="name">
</label>
<label>
<input type="radio" name="name">
</label>
<!--같은 값-->
<input type="radio" id="id" name="name">
<label for="id"></label>
<input type="radio" id="id" name="name">
<label for="id"></label>
input id랑 label for맞춰서 묶어주기
(라디오의 경우)input name으로 어떤 것이 택1이 될지 묶어주기 - 그룹화
2번으로 작성할 경우 인풋을 클릭해도 라벨에 체크 연동이 됨
포지션 등으로 사용하지않아도 따로 떨어뜨려서 디자인 가능
(1번으로 작성할 경우 한 셋트가 되어버림 input id와 label for를 안써줘도 자동 연동됨)
label,input,
input:checked,
input:focus{appearance: none; margin: 0; padding: 0; border: none; background: none; outline: none;}
/*
input[type="radio"] 등으로 개별 설정 가능
*/
label, input 데코 리셋
<form>
<input type="text" required>
</form>
input작성후 required작성 할 경우 필수입력란이 되어 작성 혹은 체크가 되지 않을 시
다음으로 넘어가지못함
radio의 경우 그룹당 하나의 input에만 required작성해주면 됨
'html' 카테고리의 다른 글
[html]모양이 변하는 svg 만들기 (0) | 2022.01.11 |
---|---|
[html]카카오맵 지도 삽입하기+구글지도 (0) | 2022.01.07 |
[html]input type="checkbox" 인풋 체크박스 css디자인 (0) | 2022.01.06 |
[html]구글 아이콘 icon (0) | 2021.12.15 |
[html]head meta 카톡 미리보기 이미지 설정 img (0) | 2021.11.23 |