h5學習作業1

2月19日家庭作業:

學習內容:

1,bgcolor:背景顏色

2,cellpadding:單元格之間的距離

3,cellspacing:框與單元格之間的距離

4,ul,ol,li序號

5,form:表單

6,checkbox:複選框,都是input標籤,通過type控制不同的類型,同一範圍的name值要一樣,也可以爲空

7,select:下拉菜單

8,fieldset框,border邊框,dashed:虛線,

作業代碼:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>wcx's homework'</title>
	</head>
	<body>
		<form style="background-color: hotpink;">
		<h1>我的家庭作業</h1>
		<table>
			<tr>
				<td>用戶名</td>
				<td><input type="text" name="username"/></td>
				
			</tr>
			
			<tr>
				<td>密碼</td>
				<td><input type="password" name="password" /><br/></td>		
			</tr>
			
			<tr>
				<td>重複密碼</td>
				<td><input type="password" name="password" /></td>
			</tr>
			
			<tr>
				<td>性別</td>
				<td><input type="radio" name="sex" />男
					<input type="radio" name="sex" />女</td>
			</tr>
			
			
			<tr>
				<td>愛好</td>
				<td>
				<input type="checkbox" name="bobby" />看書
			    <input type="checkbox" name="hobby" />看電影
			    <input type="checkbox" name="hobby" />旅遊
				</td>
			</tr>
			
			<tr>
				<td>地址</td>
				<td>
				<select name="address">
				 <option>北京</option>
				 <option>上海</option>
				 <option>廣州</option>
			</select>
				</td>				
			</tr>
			<tr>
				<td>自我介紹</td>
				<td>
					<textarea name="intro" cols="20" rows="5"></textarea>
			
				</td>
			</tr>
			<tr>
				<td>
					
			<input type="button" value="提交" id="submit" name="submit" />
			<input type="button" value="重置" id="reset" name="reset" />
				</td>
			</tr>
	
		</table>
		</form>
	</body>
</html>

效果展示:

 

 

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章