html详解(三)

7、表格标签。

<!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>
<!--
<table>表格标签 表格使用到的标签:
<table> 表格
<tr> 行
<td> 单元格
<th> 表头 默认的样式是居中,加粗。
<caption> 表格的标题 表格常用的属性:
border 设置表格的边框
width : 设置表格的宽度
height: 设置表格的高度的。
colspan: 设置单元格占据指定的列数。
rowspan : 设置单元格占据指定的行数。 -->
<body>
<table align="center" border="1px" bordercolor="#0066CC" width="400px" height="300px">
<caption>期末考试成绩表</caption>
<thead>
<tr>
<th>姓名</th>
<th>分数</th>
<th>人品</th>
</tr>
</thead> <tbody>
<tr>
<td rowspan="2">凡江</td>
<td>98</td>
<td>优</td>
</tr> <tr> <td>100</td>
<td>优</td>
</tr> <tr>
<td>居东东</td>
<td>99</td>
<td>非常好</td>
</tr> <tr align="center">
<td>综合测评</td>
<td colspan="2">非常好</td>
</tr> </tbody> </table>
</body>
</html>

表格标签的作业:

<!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>
<table border="1px" align="center" width="400px" height="300px">
<tr>
<th colspan="3">学生成绩</th>
</tr> <tr>
<td rowspan="2">张三</td>
<td>语文</td>
<td>98</td>
</tr> <tr>
<td>数学</td>
<td>95</td>
</tr> <tr>
<td rowspan="2">李四</td>
<td>语文</td>
<td>88</td>
</tr> <tr>
<td>数学</td>
<td>91</td>
</tr>
</table> </body>
</html>

8、表单标签。

<!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>
<!--
表单标签: 表单标签的作用是用于提交数据给服务器的。 表单标签的根标签是<form>标签 常用的属性:
action: 该属性是用于指定提交数据的地址。
method: 指定表单的提交方式。
get : 默认使用的提交方式。 提交的数据会显示在地址栏上。
post : 提交的数据不会显示在地址栏上。 注意: 表单项的数据如果需要提交到服务器上面,那么表单项必须要有name的属性值。 -->
</head>
<body>
<form action="http://www.baidu.com" method="post">
<!-- 文本输入框 单行-->
用户名:<input name="userName" type="text"/><br/>
<!-- 密码框 -->
密码:<input name="password" type="password"/><br/>
<!-- 单选框 -->
性别: 男<input checked="true" value="man" name="sex" type="radio"/> 女<input name="sex" value="woman" type="radio"/><br/>
<!-- 下拉框 -->
来自的城市:<select name="city">
<option value="BJ">北京</option>
<option value="SH">上海</option>
<option value="GZ">广州</option>
<option value="SZ">深圳</option>
</select><br/>
<!-- 复选框 同一组的复选框name的属性值要一致 -->
兴趣爱好:java <input value="java" name="hobit" checked="checked" type="checkbox" />javascript <input type="checkbox" value="javascript" name="hobit" />android <input value="android" name="hobit" type="checkbox" /><br/>
<!-- 文件上传框-->
大头照:<input name="image" type="file" /><br/>
个人简介:
<!-- 文本域 -->
<textarea name="intro" rows="10" cols="30"></textarea><br/> <!-- 提交按钮 -->
<input type="submit" value="注册"/>
<!-- 重置按钮 -->
<input type="reset" value="重置"/> </form>
</body>
</html>
上一篇:CodeForces 462B Appleman and Card Game(贪心)


下一篇:Python学习——struct模块的pack、unpack示例