Notice
Recent Posts
Recent Comments
Link
«   2025/02   »
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
Tags more
Archives
Today
Total
관리 메뉴

블로그

코딩공부)HTML_웹표준 5일차-form태그 본문

HTML

코딩공부)HTML_웹표준 5일차-form태그

오구리 2018. 12. 23. 01:35
728x90

**입력양식(Form)**

사용자가 페이지에 값을 전달하는 모든 형식

(회원가입,게시판,로그인,상품주문,이메일,설문조사)


*form*

1.모든 폼 요소는 <form>~</form> 안에서 작성

2.모든 폼 요소는 반드시 이름(name AND id)작성

3.대부분의 요소는<input>태그로 작성(한줄만입력-제목)

4.<textarea>(텍스트 영역-여러줄 입력-내용),<select>,<button>는 독립태그


<input>은 닫는태그 없다.

<input type="   ???   ">



*type의 속성값

1.text

2.password


-input type="text,password"는 같다.

value="기본텍스트"

size="한칸에보여지는 글자수-숫자가 기본"

ex)size:10 : 10글자가 보이는 길이로 만들기

maxlength="최대글자수"


3.checkbox

-value값(데이터베이스)을 쓸수있다.

value에 적혀있는 값이 저장됨

text,password와는 차이가 있음

-체크가 되어있게 하려면 id값뒤에 checked를 입력

radio와 사용법이 같다.

차이는 체크박스는 중복선택이 가능


4.radio

-value값 쓸수있다. 실제로 저장되는 값

체크가 되어있게 하려면 id값뒤에 checked를 입력

-규칙이 같은 name중에 하나

*name값을 주면 중복선택되지 않는다.

(값을 주지않으면 임의의 값을 알아서 각각준다.)


5.file

input type text와 같다

max length="최대글자수"절대 쓰면안된다.(경로가 들어갈 공간때문)


6.image

button type="submit"+img

image태그는 전송기능인데 버튼이아니라 이미지로 전송기능 구현

button type="submit"과 같은 속성인데 img로 된것

ex)네이버 검색에서 돋보기모양


7.hidden

실제로 보이지 않는 칸

화면에 담아줘야하는 정보 사람들에게 보이지 않아도 되는 정보

레이아웃에 영향을 주지 않는다.


8.submit

input type일때는 보여질 글자를 vlaue에 입력

button일때는 보여질 글자를 버튼타입 사이에 입력

사람들이 입력할때 보내는 버튼 - 찾아볼필요


9.reset


10.button

버튼의 기능을 없고 모양만 있음

기능이 없기때문에 다른기능과 연결할 수 있다


*

<textarea>텍스트 영역에 미리 보여질 내용</textarea>

cols="글자수" row="줄수"



*

<select>

<option>항목1</option>

<option>항목2</option>

</select>
(전화번호 지역 카테고리)
-size="3" 스크롤길이 / size속성이 있을때 multiple속성을 추가할수있다.(중복선택)
multiple은 size와 함께 사용

-체크가 되게 나오게 하려면 selected입력
-저장하고 싶은 값은 value에 입력


*
<button>보여질 텍스트</button>

-submit,reset,button은 input대신에  button태그로 한다
★input은 닫는태그가 없다.(같은속성:img,hr,br,mera)이 있다.

-ctrl+e = 컬러픽커