HTML 04

2017. 2. 16. 20:36Work/HTML

728x90
반응형

입력 양식 태그

form 태그

<form></form>

<form method="get">

        <input type="text" name="Search"/>

        <input type="submit"/>

    </form>

- action : 입력 데이터의 전달 위치를 지정합니다.

- method : 입력 데이터의 전달 방식을 선택


Input 태그

      <input type="color"/><br/>

      <input type="url"><br/>

      <input type="week">

<Input></Input>

- button : 버튼을 생성

- checkbox : 체크박스를 생성

- file : 파일 입력 양식을 생성

- hidden : 보이지 않습니다.

- image : 이미지 형태를 생성

- password : 비밀번호 입력 양식을 생성

- radio : 라디오 버튼 생성

- reset : 초기화 버튼을 생성

- submit : 제출 버튼을 생성

- text : 글자 입력 양식을 생성

HTML5 추가

- color : 색상 선택 양식을 생성

- date : 일 선택 양식을 생성

- datetime : 날짜 선택 양식을 생성

- datetime-local : 지역 날짜 선택 양식을 생성

- email : 이메일 입력 양식을 생성

- month : 월 선택 양식을 생성

- number : 숫자 생성 양식을 생성

- range : 범위 선택 양식을 생성

- search : 검색어 입력 양식을 생성

- tel : 전화 번호 입력 양식을 생성

- time : 시간 선택 양식을 생성

- url : URL 주소 입력 양식을 생성

- week : 주 선택 양식을 생성


textarea 태그

<textarea name="textarea" id="text" cols="30" rows="10">

            Hello Textarea

      </textarea>

<textarea></textarea>

- cols : 태그의 너비를 지정합니다.

- rows : 태그의 높이를 지정합니다.

-> 영역 안에 text를 쓸 수 있다.

-> 입력 양식 안에는 input 태그를 입력


select 태그

<select multiple="multi" name="select" id="select">

      <option value="option">HTML5</option>

</select>

<select></select>

- select : 선택 양식을 생성

-- multiple : 여러 개의 목록을 선택하고 싶을 때

- optgroup : 옵션을 그룹화

-- label : 대표 목록

<optgroup label="HTML5">

      <option>Multigroup</option>

</optgroup>

- option : 옵션을 생성

-> 여러 개의 목록에서 몇 가지를 선택할 수 있는 입력 양식 요소


fieldset 태그, legend 태그

<fieldset>

            <legend>입력 양식</legend>

            <table>

                <tr>

                    <td><label for="name">이름</label></td>

                    <td><input type="name" id="name"></td>

                </tr>

            </table>

            <input type="submit"/>

       </fieldset>

<fieldset></fieldset>


728x90
반응형

'Work > HTML' 카테고리의 다른 글

HTML 05  (0) 2017.02.17
HTML 03  (0) 2017.02.15
HTML 02  (0) 2017.02.12
HTML 01  (0) 2017.02.12