表格标签
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>表格标签</title>
</head>
<body>
<!--
##表格标签
```html
<table>
<caption>表格名称</caption>
<tr>
<th>一个单元格</th>
<th>一个单元格</th>
</tr>
<tr>
<td>一个单元格</td>
<td>一个单元格</td>
</tr>
</table>
```
**table常见属性**
- border:边框宽度
- 宽度
- height:高度
**tr的属性**
- align: 对齐方式
**td的属性**
- 宽度
- height:高度
- 合并单元格:(值的写法,合并几个单元格,值就写几)
- 行合并:rowspan="" 将几行合并在一起,看上去是一列的几个单元格合并成了一个
- 列合并:colspan="" 将几列合并在一起,看上去是一行的几个单元格合并成了一个
**td和th**
- 区别:
- th中间的内容默认粗体居中显示
- th一般用于做表头
-->
<!-- 一个简单的表格 -->
<table border="1" width="50%" height="50%" bgcolor="gray">
<caption>用户列表</caption>
<tr align="center">
<th>序号</th>
<th>姓名</th>
<th>性别</th>
</tr>
<tr align="center">
<td>1</td>
<td>张三</td>
<td>男</td>
</tr>
<tr align="center">
<td>2</td>
<td>李四</td>
<td>女</td>
</tr>
</table>
<!-- 合并单元格 -->
<table border="1" width="50%" height="50%" bgcolor="gray">
<caption>用户列表</caption>
<tr align="center">
<th>默认单元格</th>
<th>默认单元格</th>
<th>默认单元格</th>
</tr>
<tr align="center">
<td colspan="3">这是一个列合并单元格(colspan="3")</td>
</tr>
<tr align="center">
<td rowspan="2">这是一个行合并单元格(rowspan="2")</td>
<td>默认单元格</td>
<td>默认单元格</td>
</tr>
<tr align="center">
<td>默认单元格</td>
<td>默认单元格</td>
</tr>
</table>
<!-- 表格嵌套 -->
<table border="1">
<caption>表格的嵌套</caption>
<tr>
<td rowspan="3">
<table>
<tr>
<td>2</td>
<td>2</td>
</tr>
<tr>
<td>2</td>
<td>2</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
<tr>
<td>1</td>
<td>1</td>
<td>1</td>
</tr>
</table>
</body>
</html>
表单
这段我必须承认我非常无耻的抄了别人的笔记…
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>表单标签</title>
</head>
<body>
<!--
* 表单标签(**********)
* 收集用户输入的数据
* 表单的标签
<form >
* form的属性
* action="表单的提交路径"
* http://www.baidu.com
* html页面
* method="提交方式(默认是get方式)"(面试题)
* form表单的提交方式有哪些?(get和post的区别)
* 答:form表单提交方式有很多,常用的有两种post和get
* post和get提交方式的区别:
* get方式会把参数列表显示在地址栏上,post方式不会(请求体)。
* get方式说明网站安全级别较低,post安全级别较高。
* get方式不支持大数据,post支持大数据。
* 推荐大家使用post方式。
* 用户输入的内容
<input type="类型" name="名称(必须要指定)" value="是否指定value属性" />
* name属性必须要指定,value可以看情况指定
* type="text" 普通的文本框
* name必须指定
* type="password" 密码框
* * name必须指定
* type="radio" 单选按钮
* name必须指定 value必须指定
* name的属性,值要相同
* 默认值:checked=checked或者true
* type="checkbox" 多选按钮
* name必须指定 value必须指定
* 默认值:checked=checked或者true
* type="reset" 重置:恢复到最初的状态
* type="submit" 提交表单
* 点击提交后,地址栏发生了变化(?sex=on)
* 在普通的文本框上添加name属性 name="username"之后,点击提交,地址栏发生了变化(?username=haha&sex=on)
String str = "?username=haha&sex=on";
* ?username=zhangsan&password=123&sex=nan&love=zq
* type="file" 选择文件
* name属性指定
* type="hidden" 隐藏组件
* name指定 value指定
* type="button" 按钮
* value="显示的文字"
* 和js(javascript) 绑定事件
* type="image" 图片
* 提交 引入外部的一个文件(图片)
* 声明选择框
<select name="city">
<option value="bj"></option>
<option value="sh"></option>
</select>
* <textarea>文本域
* rows="行"
* clos="列"
* name属性指定
* selected="selected" 代表默认值
</form>
-->
<form>
输入姓名:<input type="text" name="username"/><br/>
输入密码:<input type="password"/><br/>
选择性别:<input type="radio" name="sex" value="male"/>男
<input type="radio" name="sex" checked="checked" value="femal"/>女<br/>
选择爱好:<input type="checkbox" name="love" value="basketball"/>篮球
<input type="checkbox"/>足球
<input type="checkbox"/>冰球
<input type="checkbox"/>排球<br/>
选择附件:<input type="file"><br/>
隐藏组件:<input type="hidden" name="userID" value="001"><br/>
选择城市:<select name="city">
<option>请选择</option>
<option value="wh">武汉</option>
<option value="hh">黑河</option>
</select>
<input type="reset"/>
<input type="submit"/><br/>
<input type="button" value="test"/>
<input type="image" src="../imgs/tj.png" >
个人简介:<textarea cols=10 rows="20"></textarea>
</form>
</body>
</html>
其他
其他的忽略了…实在不感兴趣…