form태그는 유저가 UI 컴포넌트에 입력한 값들을 묶어서 전송하는 역할을 수행한다.
form 태그는 그 자체로 시각적인 효과는 없지만 범위를 설정하는 기능을 한다.
JSP 연동에 있어 효과적(전송기능!!)으로 사용할 수 있는 태그이니 간단한 개념이지만 확실하게 알아두자.
<fieldset></fieldset>
: 그룹화 목적으로 사용하는 테두리 선
<legend></legend>
: fieldset으로 만들어진 테두리에 내용을 입력가능하다(주로 제목)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 | <%@ page contentType="text/html; charset=utf-8"%> <!doctype html> <html lang="utf-8"> <head> <meta charset="UTF-8"> <title>Document</title> <style> ul{ list-style:none; /* dot 삭제*/ } label{ width:70px; /*label 간격조절*/ display:inline-block; } </style> </head> <body> <form> <fieldset> <legend>회원가입</legend> <ul> <!-- 순서 없는 목록 unordered List--> <li> <label for="user_id">아이디</label> <input type="text" id="user_id"> </li> <li> <label for="user_pwd">비밀번호</label> <input type="text" id="user_pwd"> </li> <li> <label for="user_name">이름</label> <input type="text" id="user_name"> </li> <li> <label for="user_phone">연락처</label> <input type="text" id="user_phone"> </li> <li> <label for="user_email">이메일</label> <input type="text" id="user_email"> </li> <li> <button>가입</button> </li> </ul> </fieldset> </form> </body> </html> | cs |
'문돌이의 IT > HTML&CSS' 카테고리의 다른 글
| HTML 이미지삽입, 하이퍼링크삽입, <iframe> 태그 (0) | 2017.04.15 |
|---|---|
| HTML이란? Hyper Text Markup Langauge (0) | 2017.04.14 |
| [문돌이의IT] HTML form태그와 get방식에 대해 알아보자 (0) | 2016.02.04 |
| [문돌이의IT] colspan, rowspan CSS속성으로 표의 셀병합 기능 표현하기 (0) | 2016.01.17 |
| [문돌이의IT] 자주 사용하는 CSS속성으로 HTML 표꾸미기 (0) | 2016.01.16 |