[HTML] table, input, form

<table>

<table> : 표를 만드는 태그다.

<tr> : table-row, 가로줄(행)을 만든다.

<th> : 헤더 데이터를 저장하는 셀을 만든다.

<td> : 일반적인 데이터를 저장하는 셀을 만든다.

  <table border="1">
    <tr>
      <th>번호</th>
      <th>이름</th>
    </tr>
    <tr>
      <td>1</td>
      <td>김OO</td>
    </tr>
    <tr>
      <td>2</td>
      <td>박OO</td>
    </tr>
  </table>

<input>, <form>, <label>

<input type="text"> : 텍스트를 입력받는다.

<input type="text" placeholder="ID"> : 텍스트 박스 배경에 문구를 추가한다.

<input type="text" value="abc123"> : 미리 문구를 입력해둔다.

<input type="password"> : 비밀번호를 입력받는다.

<input type="submit" value="로그인"> : 전송 버튼이다. value는 버튼에 표시될 텍스트다.

<form> : 주로 로그인, 회원가입 창을 만들 때 사용한다. 주로 form이 input을 포함하는 형태로 사용된다.

<form id="login-form">
  <input type="text" placeholder="ID"> <br>
  <input type="password" placeholder="PW"> <br>
  <input type="submit" value="Login">
</form>

<label> : 여기선 radio, checkbox 옆에 텍스트를 표시하기 위해 사용한다.

<input type="radio"> : 하나만 선택 가능한 체크(?) 박스다.

- 여러 개 중 하나만 선택 되게 하기 위해선 같은 그룹으로 묶어야 함. 그러기 위해선 name 값을 일치시켜야 한다.

<label for="A-type">A형</label>
<input type="radio" name="blood" id="A-type" value="A">
<label for="B-type">B형</label>
<input type="radio" name="blood" id="B-type" value="B">
<label for="O-type">O형</label>
<input type="radio" name="blood" id="O-type" value="O">

<input type="checkbox"> : 여러 개 선택 가능한 체크 박스다.

radio와 마찬가지로 같은 그룹으로 묶고 id를 부여하고 value 설정을 해줘야 한다.

<label for="apple">사과</label>
<input type="checkbox" id="apple" value="apple">
<label for="banana">바나나</label>
<input type="checkbox" id="banana" value="banana">
<label for="mango">망고</label>
<input type="checkbox" id="mango" value="mango">