18. HTML Input /select/textarea/button
* HTML 양식 요소 *
* <input> 요소 *
: type 속성에 따라 여러 가지 방법으로 표시 할 수
<input name="firstname" type="text">
* <select> 요소 *
: 드롭 다운 목록을 정의합니다.
<select name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
- <option> 요소 : 기본적으로 드롭 다운 목록의 첫 번째 항목이 선택됩니다.
미리 선택된 옵션을 정의하려면 selected 를 추가합니다.
<option value="fiat" selected>Fiat</option>
- size 표시 값 : 사용 size 표시 값의 수를 지정하는 속성
<select name="cars" size="3">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
* <textarea> 요소 *
: 여러 줄 입력 필드를 정의합니다.
rows 속성은 텍스트 영역의 행 수를 지정합니다.
cols 속성은 텍스트 영역의 폭을 지정합니다.
<textarea name="message" rows="10" cols="30">
The cat was playing in the garden.
</textarea>
* <button> 요소 *
: 클릭 할 수 있는 단추를 정의합니다.
<button type="button" onclick="alert('Hello World!')">Click Me!</button>
// 버튼 클릭 시 Hello World! 가 적혀있는 창을 띄어 알려준다.