<html>
<head>
<title>梦里花落知多少</title>
<style. type="text/css">
body {background-color:lightpink}
h1 {color: blue;
word-spacing: 10px;
text-transform. capitalize;
text-decoration: underline;
white-space: pre}
p {color: yellow;
text-indent:0em;
word-spacing:-5em;}
tr.name {background-color: green;
padding: 20px;}
tr.gender {background-color: lightblue;}
form. {background-image: url(http://www.w3school.com.cn/i/eg_bg_04.gif);
background-repeat:repeat;
background-attachment:fixed;
background-position:center;
}
input[type=checkbox] {color:lightred;}
ul {list-style-type: square;
list-style-position: inside;}
table,th,td {border: 1px solid blue;}
</style>
</head>
<body bgcolor="green">
<div align="center">
<!--图像的三种对齐方式：bottom、middle和top；left和right分别让图像浮动在文字的左侧和右侧-->
<a href="http://www.51testing.com/html/index.html"><img src="http://att3.citysbs.com/200x240/hangzhou/2012/07/25/15/151024_12571343200224144_f791242cbabb6c80fbdf50b0cc698f37.jpg" align="bottom" alt="希腊" width="200" height="200" border=""></a>
<h1>hello kitty</h1><br>
<p>梦里寻他千百度</p><br>
<p>那人却在灯火阑珊处</p><br>
<i><a href="http://www.19lou.com/index.html" style="text-decoration:none" target="_top">19楼</a></i>
<u><a href="mailto:19lou@mail.com">发送邮件</a></u>
</div>
<hr size="1"/>
<br>
<br>
<br>
<br>
<br>
<br>
<!--定义表格-->
<div align="center">
<font color="blue" size="5">用户资料</font><br/>
<br>
<br>
<form. name="用户资料区">
<!--border=0表示没有边框-->
<table align="center" background="http://att3.citysbs.com/120x120/hangzhou/2012/06/04/22/225853_12711338821933262_13b298e7223f64ebbfa9d789ad7c5c7e.jpg" bgcolor="" width="500" height="500" cellspacing="10" cellpadding="10" border="0">
<tr class="name">
<td>
<label>姓名：<input type="text" name="name"></label>
</td>
</tr>
<tr class="password">
<td>
<label>密码：<input type="password" name="password"></label>
</td>
</tr>
<tr class="gender" bgcolor="">
<!--th表示表头-->
<!--<th>性别:</th>-->
<td>
性别：
<label>
<input type="radio" value="male" name="gender" checked>
男
</label>
<label>
<input type="radio" value="female" name="gender">
女
</label>
</td>
</tr>
<tr class="stage" bgcolor="">
<br>
<!--<th>人生阶段:</th>-->
<td>
人生阶段：<select name="stage">
<option value="0">请选择</option>
<option value="1" selected="selected">学生</option>
<option value="2">单身</option>
<option value="3">恋爱中</option>
<option value="4">三口之家</option>
<option value="5">其他</option>
</select>
</td>
</tr>
<tr>
<td align="left">
个人兴趣：<br>
<input type="checkbox" value="唱歌">唱歌<br>
<input type="checkbox" value="跳舞">跳舞<br>
<input type="checkbox" value="看电影">看电影<br>
<input type="checkbox" value="其它">其它
</td>
</tr>
<tr class="textarea">
<td>
个人简介：<br>
<textarea rows="10" cols="40"></textarea>
</td>
</tr>
<br>
<br>
<tr class="submit&reset">
<td align="center">
<input type="submit" value="提交" name="">
<input type="reset" value="重置" name="">
</td>
</tr>
<!--无序列表（ul）：type（disc：圆点，circle：小圆圈，square：小正方形）-->
<!--有序列表：type（A：大写字母，a：小写字母，I：大写罗马字母，i：小写罗马字母）-->
<tr class="有序列表&无序列表">
<td>
<ol>
<li>哈哈</li>
<ul>
<li>哈哈1</li>
<li>哈哈2</li>
</ul>
<li>呵呵</li>
<li>嘻嘻</li>
</ol>
</td>
</tr>
<!--自定义列表-->
<tr class="自定义列表">
<td>
<dl>
<dt>cat</dt>
<dd>cat is a...</dd>
</dl>
</td>
</tr>
</table>
</form>
</div>
<div>
<fieldset>
<legend>个人兴趣</legend>
<form>
<p><textarea rows="10" cols="30"></textarea></p>
</form>
</fieldset>
</div>
</body>
</html>
