1.图片热点
2.表单制作
3.课后作业
1.图片热点
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>表单</title>
</head> <body>
<img src="../03-19/n0.jpg" usemap="map"/>
<map name="Map">
<area shape="circle" coords="398,481,50" href="http://www.baidu.com/"/>
<area shape="rect" coords="198,339,433,403" href="http://www.360.com/"/>
</map>
<br />
</body>
</html>
2.表单制作
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head> <body>
<form>
帐号:<input type="text" value="123" /><br />
密码:<input type="password"/><br />
备注:<textarea cols="35" rows="5"></textarea><br />
提交按钮:<input type="submit" value="提交"/><br />
重置按钮:<input type="reset" value="重置"/><br />
普通按钮:<input type="button" value="登录"/><br />
图片按钮:<input type="image" src="../03-19/n0.jpg" width="50"/><br />
单选:<input type="radio" name="sex"/>男<br />
单选:<input type="radio" name="sex"/>女<br />
多选:<input type="checkbox" disabled="disabled"/>可乐</br>
多选:<input type="checkbox" />百事</br>
多选:<input type="checkbox" />芬达</br>
选择文件:<input type="file"/><br />
下拉列表:<br />
<select size="1">
<option value="">汉堡</option>
<option>鸡腿</option>
<option selected="selected">薯条</option>
</select>
</form>
</body>
</html>
3.课后作业——制作注册界面
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>注册页面</title>
</head> <body leftmargin="100" rightmargin="100">
<table align="left" width="300" height="550" border="0" cellpadding="0" cellspacing="0"/>
<tr align="center" valign="middle">
<td align="right">登陆用户名</td><td align="left"><input type="text" size="20" maxlength="2" /></td></tr>
<tr align="center" valign="middle"><td align="right">显示名称</td><td align="left"><input type="text" maxlength="4" /></td></tr>
<tr align="center" valign="middle"><td align="right">密码</td><td align="left"><input type="password" maxlength="8" /></td></tr>
<tr align="center" valign="middle"><td align="right">确认密码</td><td align="left"><input type="password" maxlength="8" /></td></tr>
<tr align="center" valign="middle"><td align="right">E-MAIL</td><td align="left"><input type="email" /></td></tr>
<tr align="center"><td align="right">性别</td><td align="left"><input type="radio" name="SEX">男<input type="radio" name="SEX">女</td></tr>
<tr align="center"><td align="right">性取向</td><td align="left"><select size="1"><option selected="selected">同性恋</option><option>异性恋</option><option>双性恋</option></select></td></tr>
<tr align="center"><td align="right">爱好</td><td align="left"><select size="1"><option selected="selected">听音乐</option><option>跑步</option><option>睡觉</option></select></td></tr> <tr><td></td><td><input type="submit" value="确定"/><br /></td></tr>
</body>
</html>
特将表单界面加上边框