1. 程式人生 > >【html】【一個簡單的使用者登入頁面程式碼】

【html】【一個簡單的使用者登入頁面程式碼】

結果


程式碼

<!DOCTYPE html>
<html>
  <head>
    <title>使用者登入.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
    
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

  </head>
  
  <body>
    <form name="user" action="#" method="get">
    	<table  align="center">
    		<tr>
    			<td>使用者名稱</td>
    			<td>
    				<input type="text" name="username" />
				</td>
    		</tr>
    		<tr>
    			<td>密碼</td>
    			<td>
    				<input type="password"/>
				</td>
    		</tr>
    		<tr>
    			<td>性別</td>
    			<td>
    				<input type="radio" name="name" checked="checked"/>男
    				<input type="radio" name="name"/>女
				</td>
    		</tr>
    		<tr>
    			<td>地址</td>
    			<td>
    				<select>
    					<option>北京</option>
    					<option>天津</option>
    					<option>上海</option>
    				</select>
    				<select>
    					<option>海淀區</option>
    					<option>朝陽區</option>
    					<option>昌平區</option>
    				</select>
				</td>
    		</tr>
    		<tr>
    			<td>愛好</td>
    			<td>
    				<input type="checkbox" name="sport" checked="checked"/>運動
    				<input type="checkbox" name="basketball"/>籃球
    				<input type="checkbox" name="volleyball"/>排球
				</td>
    		</tr>
    		<tr>
    			<td>郵箱</td>
    			<td>
    				<input type="text" name="emall" />
				</td>
    		</tr>
    		<tr>
    			<td>電話號碼</td>
    			<td>
    				<input type="text" name="phone" />
				</td>
    		</tr>
    		<tr>
    			<td>上傳頭像</td>
    			<td>
    				<input type="file" name="file" />
				</td>
    		</tr>
    		<tr>
    			<td>其他</td>
    			<td>
    				<textarea rows="15" cols="50"></textarea>
				</td>
    		</tr>
    		<tr>
    			<td></td>
    			<td>
    				<input type="button" value="普通按鈕"/>
    				<input type="submit" name="tijiao" value="註冊"/>
    				<input type="reset" name="quxiao" value="取消"/>
				</td>
    		</tr>
    		<tr>
    			<td></td>
    			<td>
    				<input type="image" name="img" src="btn.gif"/>
				</td>
    		</tr>
    	</table>
    </form>	
  </body>
</html>

用到的圖片