Day48 - [JSP]html_form , 태그의 성질

이번에는 JSP 환경에서 html의 form 과 태그의 성질에 대해서 알아 봅시다 !

 

form

<form>은 형태를 의미합니다.

<input type> 속성을 이용해서 여러가지 형태를 만들 수 있습니다.

 

type의 속성

text :일반적인 text데이터를 입력하기 위해 사용.

password : 로그인, 회원가입 페이지 등에서 비밀번호 입력을 하기 위해 사용.

checkbox : 데이터 값을 여러 개 전송해야 할 때 사용.

radio : 여러 개의 데이터 값 중에 한 개의 값만 전송해야 할 때 사용.

select : 리스트 형태의 데이터를 사용.

textarea : 여러 줄의 텍스트를 입력하기 위해 사용. 속성 cols와 rows로 행과 열의 크기를 지정.

button : 버튼 형태를 만들기 위해 사용. 속성으로 value를 지정하여 버튼 안에 들어갈 문자열을 입력.

submit : form내의 데이터를 서버로 전송할 때 사용.

reset : form내의 데이터를 초기화할 때 사용.

file : 파일 업로드를 위해 사용

 

<form><input type=""> </form> 의 형태로 작성을 해주시면 됩니다.

size는 네모박스의 크기를 의미합니다.

placeholder는 text 타입에 표시해줄 글자 입니다.

password type은 안에 글자를 입력할 경우 *** 로 보입니다.

checkbox 와 radio 타입은 name을 만들어서 명시 해주어야 합니다.

그 이유는, radio 타입은 같은 name으로 그룹된 것들 중에 1개만 선택할 수 있기 때문입니다.

select 와 option 을 이용해서, 선택목록을 만들 수 있습니다.

textarea 를 이용해서, 큰 네모박스를 만들 수 있습니다.

submit , reset , button 을 이용해서 기능이 있는 버튼을 만들 수 있으며, value로 버튼의 이름을 설정할 수 있습니다.

submit 속성을 이용하면, form 내에 입력한 데이터들을 제출하는 것입니다.

reset 속성을 이용하면, form 내에 입력한 데이터들을 초기화 하는 것 입니다.

 

태그의 성질

태그는태그는 블럭, 인라인 성질로 나누어 집니다.

 

블럭요소

블럭요소는 블럭성질을 가집니다. 줄바꿈이 일어납니다.
블럭요소 안에는 블럭요소, 인라인요소가 자식태그로 들어갈 수 있습니다.

 

블럭요소를 가진 태그는 대표적으로 header, section, footer, div, form, ul 등등이 있습니다.

이러한 블럭 요소는, 하나의 네모칸을 가상으로 만든다고 생각하시면 됩니다. 그렇기 때문에 자동으로 줄이 바뀝니다.

인라인 요소

인라인 줄바꿈이 없습니다. 태그안에 내용자체를 공간으로 가집니다.
인라인요소는 인라인만 자식태그로 가질 수 있습니다.

 

인라인 요소는 대표적으로 img, a, i, b, span, strong, small 등등이 있습니다.

인라인 태그 안에 블럭 태그를 넣으면 문법상 오류가 일어납니다.

 

이번에는 이렇게, <form> 태그와, 태그의 성질(블럭요소, 인라인요소) 에 대해서 알아 보았습니다.

 

고생하셨습니다.