html로 선택 목록 상자 (콤보박스), 글 상자 만들기

• select

<select>는 선택 목록 상자 또는 콤보박스라고도 합니다.

몇 개의 선택지를 리스트 형태로 노출하고 그중 하나를 선택할 수 있게 하는 태그입니다. 

(multiple 속성을 사용하면 다중 선택도 가능합니다.)

<select>내부의 <option>으로 각 항목을 나타냅니다.

<option>의 속성으로는 selected가 있으며 이는 선택된 항목을 의미합니다.

 

 

See the Pen Untitled by HelloHailie (@hellohailie) on CodePen.

 

• textarea 한 줄만을 입력할 수 있는 <input type="text" >와 달리 여러 줄의 텍스트를 입력할 때 사용합니다.

<textarea>에는 텍스트 상자의 크기를 조절하는 rows, cols 속성이 있습니다.

• cols : 가로 크기를 조절하는 속성(한 줄에 들어가는 글자의 수, 수치의 의미는 평균적인 글자의 너비로 정확히 글자 수를 나타내지는 않습니다.)
• rows : 세로 크기를 조절하는 속성(화면에 보여지는 줄 수)
• placeholder 도 넣을 수 있다. 

 

See the Pen Untitled by HelloHailie (@hellohailie) on CodePen.

 

• button

 

 

See the Pen Untitled by HelloHailie (@hellohailie) on CodePen.