■ html의 텍스트 입력 양식 중에서 [텍스트박스]에 대해서 알아보겠습니다. 이 텍스트 박스는 사용자가 여러 라인의 글을 입력할 수 있는 메모장과 비슷한 양식인데요. 텍스트 박스의 형식과 속성을 알아보고, 예제를 만들어서 인터넷 브라우저에서 출력해보는 과정으로 정리해볼게요.
먼저 텍스트 박스의 형식과 속성입니다.
■ textarea 태그로 묶고 이름 및 문자열의 열수와 행수를 설정해줄 수 있습니다. textarea 태그 사이에 입력된 초기 문자열은 텍스트 영역에 출력되는데요. 이 형식을 참고 해서 예제를 만들어보겠습니다.
■ 예제의 내용을 잠깐 살펴보자면....전체를 form 태그로 묶고, 텍스트 박스를 '메모'라는 이름으로 15열과 100행으로 설정해봤습니다. 그리고 텍스트박스 안에 출력되는 문자열을 입력하고, "reset" 버튼을 만들어봤습니다. textarea 태그 바깥쪽에 입력된 내용은 textbox 바깥쪽에 제목처럼 출력이 될 거에요. 메모장을 html 문서로 저장하고 인터넷 브라우저에 실행해서 어떻게 출력이 되는지 살펴보고 비교해보도록 하죠.
■ 위쪽 소스와 출력된 내용을 비교해보시면 쉽게 이해가 될 거에요. 제목으로 입력한 글은 텍스트박스 바깥쪽에 출력되고, textarea 태그 안쪽에 입력한 문자열은 박스 안쪽에 출력됩니다. 15열 100행의 메모장 기능의 텍스트박스가 만들어 졌구요. 내용을 입력하다가 리셋(다시 입력) 버튼을 클릭하면 모든 내용이 삭제되고, 이 그림의 상태로 되돌아오게 됩니다. 메모장에 직접 입력해서 테스트해보세요. ^^ 수고하셨어요.
