<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>form 만들기</title>
<style>
.pink{
background:linear-gradient(to right, pink, white);}
</style>
</head>
<body>
<h1>회원가입<img src="/image/냥3.jpg" alt="고양이 사진" width="300px" height="200px"></h1>
<form action="" >
<table border="1" bordercolor="white" class="pink">
<tr>
<td colspan="3">회원가입 | Member Private Information 약관동의 실명확인 회원가입 정보수정 </td>
</tr>
<tr>
<td colspan="3">기본정보 입력 || 표시는 필수항목이므로 반드시 입력해야 합니다. </td>
</tr>
<tr>
<td>아이디</td>
<td colspan="2"><input type="text" name="id"><button type="submit"> 중복검색</button> 영문</td>
</tr>
<tr>
<td>비밀번호</td>
<td colspan="2"><input type="text" name="pw">-> 재확인 <input type="text"></td>
</tr>
<tr>
<td>비밀번호 힌트</td>
<td colspan="2"><input type="text" name="pw2"> 비번 분실 - 조회시 참고할 내용 </td>
</tr>
<tr>
<td>이름(본명)</td>
<td colspan="2"><input type="text" name="name"> -> 한글</td>
</tr>
<tr>
<td>닉네임(별명)</td>
<td colspan="2"><input type="text" name="nickname"><button type="submit"> 중복검색</button> 한글, 영문</td>
</tr>
<tr>
<td>전자메일주소</td>
<td><input type="email" name="email"></td>
<td><input type="checkbox">비공개</td>
</tr>
<tr>
<td>생년월</td>
<td>
<select name="year" id="">
<option value="">년</option>
<option>1998</option>
<option>1999</option>
<option>2000</option>
<option>2001</option>
<option>2002</option>
<option>2003</option>
</select>
<select name="month" id="">
<option value="">월</option>
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>
<input type="radio" name="calender">음
<input type="radio" name="calender" checked>양
</td>
<td><input type="checkbox">비공개</td>
</tr>
<tr>
<td>성 별</td>
<td><input type="radio" name="gender"> 남자
<input type="radio" name="gender"> 여자
</td>
<td><input type="checkbox" disabled>비공개</td>
</tr>
<tr>
<td>우편번호</td>
<td colspan="2">
<input type="number">-<input type="number">
<button type="submit">찾아보기</button>
</td>
</tr>
<tr>
<td>주소</td>
<td>
<div><input type="text"></div>
<div><input type="text"> <- 나머지 주소</div>
</td>
<td><input type="checkbox" checked>비공개</td>
</tr>
<tr>
<td>일반전화 번호</td>
<td>
<select name="tel1" id="">
<option value="">국번</option>
<option>032</option>
<option>02</option>
<option>052</option>
</select>
-<input type="number" name="tel1_1">-<input type="number" name="tel1_2">
</td>
<td><input type="checkbox" checked>비공개</td>
</tr>
<tr>
<td>휴대전화 번호</td>
<td>
<select name="tel2" id="">
<option value="">국번</option>
<option>010</option>
<option>061</option>
<option>070</option>
</select>
-<input type="number" name="tel2_1">-<input type="number" name="tel2_2">
</td>
<td><input type="checkbox" checked>비공개</td>
</tr>
<tr>
<td>홈페이지</td>
<td><input type="url" value="http://" name="page"></td>
<td><input type="checkbox">비공개</td>
</tr>
<tr>
<td>소개, 인사말</td>
<td colspan="2"><textarea name="소개" id="" cols="30" rows="5" placeholder="반갑습니다"></textarea></td>
</tr>
<tr>
<td colspan="3">추가정보 입력</td>
</tr>
<tr>
<td>사진첨부</td>
<td colspan="2">
<div><button type="submit">파일선택</button>선택된 파일 없음</div>
<div>200 X 200 픽셀 이하 크기만 허용</div>
</td>
</tr>
<tr>
<td>이름표시 아이콘</td>
<td colspan="2">
<div><button type="submit">파일선택</button>선택된 파일 없음
<button type="submit">찾아보기</button></div>
<div>25 X 25 픽셀 이하 크기만 적용</div>
</td>
</tr>
<tr>
<td>혼인여부</td>
<td>
<input type="radio" name="marrige">미혼
<input type="radio" name="marrige">기혼
<input type="radio" name="marrige">이혼
<input type="radio" name="marrige">교제중
</td>
<td><input type="checkbox">비공개</td>
</tr>
<tr>
<td>관심분야</td>
<td colspan="2">
<select name="like" id="">
<option value="">관심분야</option>
<option>수영</option>
<option>런닝</option>
<option>등산</option>
<option>요가</option>
<option>근육빵빵</option>
<option>딩굴딩굴</option>
</select>
</td>
</tr>
<tr>
<td>캐릭터 선택</td>
<td colspan="2">
<button type="submit">파일선택</button>선택된 파일 없음
</td>
</tr>
<tr>
<td>메일링 수신거부</td>
<td colspan="2"><input type="checkbox"> 메일링 수신 거부시 체크</td>
</tr>
<tr>
<td>쪽지 수신거부</td>
<td colspan="2"><input type="checkbox"> 쪽지 수신 거부시 체크</td>
</tr>
<tr>
<td>전체 비공개</td>
<td colspan="2"><input type="checkbox"> 회원등록정보 전체 비공개시 체크</td>
</tr>
<tr style="text-align: center;">
<td colspan="3" >
<button type="submit">입력완료전송</button>
<button type="reset">다시 입력하기</button>
</td>
</tr>
</table>
</form>
</body>
</html>
회원가입![고양이 사진](/image/냥3.jpg)
'HTML - CSS > html 예시' 카테고리의 다른 글
[HTML] table 빙고판 (0) | 2023.04.05 |
---|---|
[HTML] 로그인 페이지 (0) | 2023.04.05 |
[HTML] 회원가입서 (0) | 2023.04.04 |