HTML 입력태그(텍스트박스, 라디오버튼, 체크박스)

HTML 입력태그

텍스트박스, 라디오버튼, 체크박스

 

이전 포스팅에서 INPUT 태그에 대하여 알아보았습니다.

이번 포스팅에서는 예제를 통하여 어떻게 사용 하는지 알아 보도록 하겠습니다.

 

2018/01/07 - [프로그래밍/HTML, CSS, JavaScript] - HTML 입력양식 태그(INPUT)

 

INPUT 태그의 경우 타입 속성에 따라서 그 모양이 다릅니다. 추가로 TEXTAREA박스에 대하여도 알아보도록 하겠습니다.  블로그에서 댓글 입력 부분이 TEXTAREA박스 입니다.

 

예제 소스 그리고 바로 아래에 예제소스를 그대로 코딩 해 보았습니다.

예제 결과에 입력 또는 클릭을 해 보시면 됩니다.

 

■ 텍스트 입력

이름 : <INPUT TYPE = "TEXT"  NAME = "name" SIZE = "20" >
블로그  : <INPUT TYPE = "TEXT"  NAME = "BLOG" VALUE="http://" >

 

이름 : 블로그 :

 

 

■ 패스워드 입력

비밀번호 : <INPUT TYPE = "PASSWORD"  NAME= "PS" >

 

비밀번호 :

 

 

■ 체크박스(복수 개의 내용을 선택)

<INPUT TYPE = "CHECKBOX" NAME = "F"  VALUE = "A" CHECKED> 다음
<INPUT TYPE = "CHECKBOX"  NAME = "F"  VALUE = "O" > 네이버

<INPUT TYPE = "CHECKBOX"  NAME = "F" VALUE = "P" CHECKED> 구글

 

다음   네이버   구글

 

 

■ 라디오버튼(하나의 항목 선택)

<INPUT TYPE = "RADIO"  NAME = "BLOG"  VALUE = "DAUM"> 다음
<INPUT TYPE = "RADIO"  NAME = "BLOG"  VALUE = "NAVER" CHECKED> 네이버
<INPUT TYPE = "RADIO"  NAME = "BLOG"  VALUE = "GOOGLE"> 구글

 

다음   네이버   구글

 

 

■ 문서입력 

<TEXTAREA NAME = "MSG"  ROWS = "5"  COLS = "25"></TEXTAREA>