[HTML 태그들] #9 form input값 button/checkbox/radio

2021. 5. 19. 15:41HTML/HTML 태그들

오늘은 HTML의 form에 들어가는 여러 가지 input값들 중 button, checkbox, radio에 대해 알아보겠습니다.

 

1. input>>button

<input type="button">

input button

위 코드처럼 버튼을 생성할 수 있습니다.

만약 버튼에 특정한 글자를 집어넣고 싶으면 다음과 같이 value에 값을 너 주면 됩니다.

<input type="button" value="클릭!!">

input button

 

 

2. input >> checkbox

checkbox는 체크를 할 수 있는 버튼을 만들어 줍니다.

 

<input type="checkbox" name="서버에 전송될 값의 이름" value="서버에 전송될 값">

 

좋아하는 메뉴
<form action="/action_page.php">
  <input type="checkbox" name="cooking1" value="chicken">
  <label for="chicken">치킨</label>
  <input type="checkbox" name="cooking2" value="pizza">
  <label for="pizza">피자</label>
  <input type="submit" value="Submit">
</form> 

 

치킨과 피자의 checkbox를 전부 체크한 후 Submit 버튼을 누른 후 url을 살펴보면 다음과 같이 "?" 다음에 input태그의 "name값=value값" 이 들어가는 것을 확인 할 수 있습니다.