<label for="opt-in">이메일 수신 동의</label>
<input type="checkbox" id="opt-in">
브라우저에서 실제 표시된 모습
<input type="checkbox" checked>
브라우저에서 실제 표시된 모습
<input type="checkbox" disabled>
브라우저에서 실제 표시된 모습
<fieldset>
    <legend>관심이 있는 웹 개발 언어를 선택하세요.</legend>
    <div>
       <input type="checkbox" id="html">
       <label for="html">HTML</label>
    </div>
    <div>
       <input type="checkbox" id="css">
       <label for="css">CSS</label>
    </div>
    <div>
       <input type="checkbox" id="js">
       <label for="js">JavaScript</label>
    </div>
</fieldset>
브라우저에서 실제 표시된 모습
<input type="checkbox">
<input type="radio">
브라우저에서 실제 표시된 모습 다음의 예제로 실습해 보세요.
<fieldset>
    <legend>관심이 있는 웹 개발 언어를 선택하세요.</legend>
    <div>
       <input type="checkbox" id="html" name="interest" value="html">
       <label for="html">HTML</label>
    </div>
    <div>
       <input type="checkbox" id="css" name="interest" value="interest">
       <label for="css">CSS</label>
    </div>
    <div>
       <input type="checkbox" id="js" name="interest" value="interest">
       <label for="js">JavaScript</label>
    </div>
</fieldset>
그룹화된 체크 박스는 복수로 선택할 수 있습니다.
<fieldset>
    <legend>관심이 있는 웹 개발 언어를 선택하세요.</legend>
    <div>
       <input type="radio" id="html" name="interest" value="html">
       <label for="html">HTML</label>
    </div>
    <div>
       <input type="radio" id="css" name="interest" value="interest">
       <label for="css">CSS</label>
    </div>
    <div>
       <input type="radio" id="js" name="interest" value="interest">
       <label for="js">JavaScript</label>
    </div>
</fieldset>
그룹화된 라디오 버튼는 전체 중에서 하나만 선택할 수 있습니다.
input type 속성의 checkbox 값에 대한 브라우저 호환성과 관련 속성의 브라우저 호환성
속성
데스크탑 Chrome
Chrome
데스크탑데스크탑 Edge
Edge
데스크탑 Firefox
Firefox
Safari
Safari
<input type="checkbox"> 1 12 1 1
checked 1 12 1 1
disabled 1 12 1 1
name 1 12 1 1