폼 UI 기본

2013. 1. 24. 18:02 Web/Mobile


<form action="form.php" method="post">
<div data-role="fieldcontain">

<label for="name">이름</label>
<input type="text" id="name">

<label for="comment">문의 내용</label>
<textarea id="comment"></textarea>

//플립스위치
<label for="gender">성별</label>
<select name="gender" id="gender" data-role="slider">
<option value="남자">남자</option>
<option value="여자">여자</option>
</select>

//체크박스
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<legend>주제별 문의</legend>
<input type="checkbox" name="type1" id="type1" value="HP 신규작성">
<label for="type1">HP 신규작성</label>
<input type="checkbox" name="type2" id="type2" value="HP 리뉴얼">
<label for="type2">HP 리뉴얼</label>
</fieldset>
</div>

//취소,전송버튼 : data-icon="delete"아이콘추가, data-inline="true"문자열
<input type="button" value="취소" data-theme="b" data-icon="delete" data-inline="true">
<input type="submit" value="전송" data-theme="b" data-icon="arrow-r" data-inline="true">

</div>
</form>

참고: http://view.jquerymobile.com/1.3.2/dist/demos/widgets/forms/ 

'Web > Mobile' 카테고리의 다른 글

[JQuery UI]콘텐츠 영역 접이식 패널  (0) 2013.01.25
간편한 header, footer  (0) 2013.01.25
구글맵 API  (0) 2013.01.24
Jquery Mobile 태그 속성들  (0) 2013.01.24
Jquery Mobile 기본구조  (0) 2013.01.24
Copyright © HuckleberryM All Rights Reserved | JB All In One Designed by CMSFactory.NET