HTML - textarea태그와 select태그 - 입력태그 (3)

HTML - textarea태그와 select태그 

입력태그 (3)

오늘은 이전 포스팅에 이어 

HTML - textarea태그와 select태그에 

대해서 알아 보도록 하겠습니다.

태그 기초부터 알아보기 전에  

압타나 스튜디오를 직접 설치 하시고 한번씩 따라해 보시기 바랍니다.

(백번 보는 것 보다 한번 살짝 타이핑 해보면 이해 되니! 꼭!)

(굳이 압타나 아니더라도 이클립스등 자신에게 맞는 HTML 툴이 있으시다면 사용하시기 바랍니다.)

textarea태그란?

먼저 textarea태그란 여러 줄의 텍스트를 

입력받을때 사용하는 태그이며 

사용법은 아래와 같습니다. ^^

<textarea태그 사용법>

위 는 "아래 내용을 입력 하세요!" 라는 문구를 넣고 <br> 태그 2개를 이용해 2번 개행 후

textarea태그로 입력 박스를 만들었으며 textarea태그의 속성인 

rows(행), cols(열)을 

이용해서 입력박스의

 크기를 별도 지정

 하였습니다.

사용하는 방법은 위 와 같으며 한번씩 타이핑 해서

연습해 보시면 좋을 것 같습니다. ^^

select태그란?

select태그에 관련된 내용 입니다.

select태그란 메뉴를 표시하고 사용자로 하여금 선택하게끔 만드는 태그이며

select태그 작성시 그 안에 부수적인 태그 option태그의 value 속성에 넣어 사용합니다.

추가로 selected 속성을 이용해 특정 항목을

초기에 선택할 수 있는데 이 내용은 아래 내용에서 확인해 보겠습니다.

<select태그 사용법>

위 는 select 태그안에 option 태그를 넣어 각각의 메뉴를 표시해 보았습니다.

현재 option태그에 selected 속성을 사용하지 않아 제일 첫번째 기타가 표시 되는데

아래는 중간 "장수풍뎅이" 부분에 selected 속성을 넣어 보도록 하겠습니다. ^^

<select태그안 option태그에 selected속성 적용>

위 는 option 태그에 selected속성을 넣은 모습입니다.

보시다 시피 장수풍뎅이 부분에 selected 속성을 넣어 가장 첫번째

표시되는 부분을 장수풍뎅이로 바꾸어 보았습니다.

여기까지 

 textarea태그와 select태그에 대해서

알아보았으며 위 태그 같은 경우 

하나씩 써보면 금방 이해가 되실 겁니다. ^^

이상 HTML - textarea태그와 select태그 - 입력태그 (3)에 

관련된 포스팅을 마치도록 하겠습니다.