HTML/input 태그

input 태그와 label태그의 이해

디지털노마드-건물주 2024. 1. 31. 14:51
728x90

1. 본론 

  • input 태그의 id값과 label 태그의 for 속성을 일치시키면 클릭의 범위가 넓어진다. 
  • React는 for 대신 htmlFor를 사용한다. 
<!DOCTYPE html>
<html>
  <head></head>
  <body>
    <form action="">
      <label for="sangNamja">당신은 상남자입니까?</label>
      <input type="checkbox" id="sangNamja">
    </form>
  </body>
</html>

 

결과 

  • 부가 설명: 아래는 "당신은 상남자입니까?" 글 위에 클릭 시에 check가 되는 경우를 설명 

label for 속성과 input태그의 id를 일치의 경우

 

728x90