본문 바로가기

웹/HTML

HTML radio checkbox

 

HTML radio checkbox

여러 항목 중에서 선택을 할 수 있게 만들어주는 태그이다.


        

색상(단일 선택)


   붉은색 :

   붉은색 <input type = "radio" name = "radio" value = "red" checked>

   검은색 :

   검은색 <input type = "radio" name = "radio" value = "red" >

   파란색 :

   파란색 <input type = "radio" name = "radio" value = "red">

 input type ="radio"로 설정을 하면 동그라미 표시가 나오게 된다

name은 선택하는 것을 그룹핑해주는 것이다. 만일 name으로 그룹핑을 해주지 않으면 동그라미 표시가 3개 있을 때 3개를 다 표시할 수 있게 된다. 그룹핑을 해줌으로써 한 개만 선택할 수 있게 한다

value는 내가 서버로 정보를 보낼 때 이게 무엇인지를 알려주는 것이다.

checked는 홈페이지에 처음 들어갔을 때 기본으로 선택되게 해주는 것이다.
        

사이즈(다중 선택)

  95 :

      95 : <input type = "checkbox" name = "size" value = "95" checked>

  100 :

      100 : <input type = "checkbox" name = "size" value = "100">

  105 :

      105 : <input type = "checkbox" name = "size" value = "105">


다중 선택을 사용하기 위해서는 type을 checkbox로 설정한다. box이기에 모양은 상자 모양으로 나온다.

name으로 그룹핑을 해줌으로써 같은 그룹에 있다는 걸 알려준다. 근데 그룹핑 안 해도 딱히 체크하는데 문제는 없다.

value는 서버에 정보를 보낼 때 이 정보가 무엇인지를 알려주는 것이다

<input type = "submit">

출처 : 생활코딩 HTML

' > HTML' 카테고리의 다른 글

HTML Button  (0) 2020.03.29
HTML dropdownlist  (0) 2020.03.28
HTML textarea  (0) 2020.03.28
HTML form  (0) 2020.03.28
HTML 표 만들기  (0) 2020.03.28