<!--
表格:<table></table>
行:<tr></tr>
单元格:<td></td> 默认左对齐
<th></th>(表头)默认居中,字体加粗
表格属性:
边框 border=数字值
单元格与内容之间的间距 cellpadding="数字"
单元格与单元格之间的间距 cellspacing="数字"
对齐方式:
垂直对齐 valign="" //top middle bottom
水平对齐 align="" //left center right
单元格合并:
行合并 rowspan="合并的行数"
列合并 colspan="合并的列数"
------------------------------------------------------------------------------------
表单:<form>....</form>
表单属性:<form action="url" method="get>..</form> //method ->post/get
url:跳转的页面
问题:post和get的区别?
答:GET一般用于获取/查询 资源信息,而POST一般用于更新 资源信息。
文本框:<input type="text" name="addr" value=""/>
密码框:<input type="password" name="psw" value=""/>
按钮:
普通按钮:<input type="button" name="psw" value=""/>
提交按钮:<input type="submit" name="psw" value=""/>
重置按钮:<input type="reset" name="psw" value=""/>
单选框:(同一组里面有不同的选项,要求name要一致,只能任选一项)
<input type="radio" name="" value="">描述的内容</input>
复选框:(同一组里面有不同的选项,建议name一致,可以有多个选项)
<input type="checkbox" name="" value="">描述的内容</input>
下拉框:
<select name="">
<option value=""> 描述信息</option>
</select>
文本域:
<textarea name="" rows="" cols=""></textarea>
属性:行:rows 列:cols
表单元素属性:
disabled:规定禁用该文本区
readonly:规定文本区为只读
------------------------------------------------------------------------------------------
文本中加空格
//-->
<html>
<head>
<title>表格与表单</title>
</head>
<body>
<h2>表格</h2>
<hr size="5" color="red"/>
<table border="1" width=800 height=400>
<tr >
<td align="center">1,1</td><td align="right">1,2</td> <!--单元格内容的水平排列方式-->
<td>1,3</td><td rowspan="2">1,4</td> <!--合并行单元格-->
</tr>
<tr>
<td valign="bottom">2,1</td><td valign="top">2,2</td> <!--单元格-内容的垂直排列方式-->
<td valign="middle">2,3</td>
</tr>
<tr>
<td>3,1</td><td>3,2</td><td>3,3</td><td>3,4</td>
</tr>
<tr>
<td>4,1</td><td>4,2</td><td>4,3</td><td>4,4</td>
</tr>
<tr>
<td colspan="3">5,1</td> <!--合并列单元格-->
<td>5,4</td>
</tr>
</table>
<h2>表格和表单</h2>
<hr size="5" color="blue"/>
<form action="http://www.baidu.com" method="get">
<table border="1">
<tr>
<td>邮箱号:</td>
<td>
<input type="text" name="text1" value=""></input> <!--文本框-->
<select name="emailAddr"> <!--选择框-->
<option>@163.com</option><option>@126.com</option><option>@qq.com</option>
</select>
</td>
</tr>
<tr>
<td>密 码:</td>
<td><input type="password" name="password1" valu=""></input></td> <!--密码框-->
</tr>
<tr>
<td>性 别:</td>
<td><input type="radio" name="sex" value="F"> 男</input> <!--下拉框-->
<input type="radio" name="sex" value="M"> 女</input></td>
</tr>
<tr>
<td>兴趣爱好</td> <!--复选框-->
<td>
<input type="checkbox" name="enjoy" value="">篮球</input>
<input type="checkbox" name="enjoy" value="">足球</input>
<input type="checkbox" name="enjoy" value="">台球</input>
<input type="checkbox" name="enjoy" value="">羽毛球</input>
<input type="checkbox" name="enjoy" value="">乒乓球</input>
</td>
</tr>
<tr>
<td>地区代码</td>
<td>
<select name="select1"> <!--下拉框-->
<option value="">请选择地区</option><option value="350200">厦门</option>
<option value="360600">漳州</option><option value="350500">泉州</option>
</select>
</td>
</tr>
<tr>
<td>反馈意见</td> <!--文本域-->
<td><textarea name="textarea1" rows="10" cols="30" >请填写信息</textarea></td>
</tr>
<tr>
<td> </td>
<td>
<input type="submit" name="submit1"></input> <!--按钮-->
<input type="reset" name="reset1"></input>
<input type="button" name="button1" value="普通按钮"></input>
</td>
</tr>
</table>
</form>
</body>
</html>