Form Element

목록상자


목록항목의 그룹화

select box 의 size attribute는 select box로 나타내는 항목 수를 보여줍니다.

							<fieldset>
								<legend>목록상자</legend>	
								<p>
									<label for="user_age">연령</label>
									<select name="" id="user_age">
										<option value="10">10대</option>
										<option value="20">20대</option>
										<option value="30">30대</option>
										<option value="40">40대</option>
									</select>
								</p>
								<p>
									<label for="user_phone">연락처 정보</label><br />
									<select name="" id="user_phone" size="10" multiple="multiple">
										<option value="">010-2543-2578</option>
										<option value="">010-2543-2578</option>
										<option value="">010-2543-2578</option>
										<option value="">010-2543-2578</option>
										<option value="">010-2543-2578</option>
										<option value="">010-2543-2578</option>
									</select>
								</p>
							</fieldset>
						
							<fieldset>
								<legend>목록항목의 그룹화</legend>	
								<p>
									<label for="user_adrs">주소</label>
									<select name="" id="user_adrs">
										<optgroup label="서울특별시">
											<option value="">강남구</option>
											<option value="">강동구</option>
											<option value="">동대문구</option>
											<option value="">송파구</option>
											<option value="">성동구</option>
											<option value="">중국</option>
										</optgroup>
										<optgroup label="경기도">
											<option value="">과천시</option>
											<option value="">광주시</option>
											<option value="">부천시</option>
											<option value="">성남시</option>
											<option value="">안양시</option>
										</optgroup>
									</select>
								</p>
							</fieldset>
						
개인정보 입력
- -
메일링 리스트 가입


							<div id="" class="tbl_form_wrap">
								<table border="1" cellspacing="0" cellpadding="0" summary="이름 , 휴대폰 이메일 정보 입력 및 메일링 가입여부 확인" class="tbl_form">
									<caption>개인정보 입력</caption>
									<colgroup>
										<col width="" />
									</colgroup>
									<tbody>
										<tr>
											<th scope="row">
												<label for="username">이름</label>
											</th>
											<td>
												<input type="text" name="username" id="username" value="" placeholder="" />
											</td>
										</tr>
										<tr>
											<th scope="row">
												<label for="cellno">휴대폰</label>
											</th>
											<td>
												<input type="text" name="cellno" id="cellno" maxlength="3" size="3" value="" title="휴대폰첫째자리" />
												-
												<input type="text" name="cellno2" maxlength="4" size="4" value="" title="휴대폰중간자리" />
												-
												<input type="text" name="cellno3" maxlength="4" size="4" value="" title="휴대폰끝자리" />
											</td>
										</tr>
										<tr>
											<th scope="row">
												<label for="mailaddr">이메일</label>
											</th>
											<td>
												<input type="text" name="mailaddr" id="mailaddr" maxlength="60" size="57" value="" />
											</td>
										</tr>
										<tr>
											<th scope="row">
												메일링 리스트 가입
											</th>
											<td>
												<input type="radio" name="received" id="receive_yes" value="Y" checked="checked" title="메일링 리스트 가입 여부" />
												<label for="receive_yes">예</label>
												<input type="radio" name="received" id="receive_no" value="N" checked="checked" title="메일링 리스트 가입 여부" />
												<label for="receive_no">아니요</label>
											</td>
										</tr>
									</tbody>
								</table>
							</div>