表格:
table 所有的表格元素 都在table标签里面编写
属性: 写在标签内部
border: 声明 表格边框
标题 | 没有边框 |
---|---|
表格行 | 没有边框 |
只有表格单元格 | 有边框 |
border 有数值 里面的数值 控制最外面的边框是 table 独有属性
cellspacing: 控制单元格之间的距离 是 table 独有属性
cellpadding:控制单元格内部的内边距
caption 编写表格标题 文字居中
thead 定义表头行
th 定义 表头行 里面的 标准单元格 文字居中 文字加粗
tbody 定义 表格内容区域
tr 定义表格行
td 定义 表格 标准单元格 列
tfoot 定义表格尾部 也是行
单元格没有特殊标签 就使用 td
rowspan: 行合并, 将下面行的 同列 单元格 合并到 本身单元格中,
被合并的单元格 不在下面行出现(被合并的单元格 不用再写td)
colspan:列合并, 将 同行 单元格 合并到 本身单元格中,被合并
的单元格 不在同行出现(被合并的单元格 不用再写td)
<table></table> 表格
<caption> </caption> 表格标题
<thead></thead> 表格头
<th></th> 表头单元格
<tbody></tbody> 表格主体
<tr></tr> 表格行
<td></td> 标准单元格
<tfoot></tfoot> 表格尾部
表单 from:
属性:
action 定义 提交的网址
method 定义 请求方式
get
优点:速度快 给服务器造成的压力小
缺点:保密性差 传输的文件大小有限制
post
优点:保密性好 可以上传大文件
缺点:给服务器造成的压力大 速度慢
input 元素
属性:
name: 定义 input元素的名称 作为提交给服务器的参数名
value: input元素的值 作为提交给服务器参数名所对应的值
类型:
text | 文本 |
---|---|
placeholder | 定义 文本框内 默认展示的值 |
password | 密码框 在里面输入的值会以星号 或者圆点展示 |
buttom | 普通按钮 |
checkbox | 复选框 |
radio | 单选框 |
number | 数字输入框 |
checked | 默认选中 |
file: | 上传文件 |
---|---|
reset | 重置 清空表单中已输入的内容 |
submit | 提交按钮 向服务器发送 表单数据 发送向action 设置的提交页面 |
select/option | 下拉菜单 创建多选单选菜单 必须组合使用 |
textarea: 定义多行的文本输入控件
cols :定义文本宽度
rows:定义文本行数
表单初始化:
form{
margin:0;
}
input{
outline:0 清除选中状态下的蓝色外边框 使用
margin:0;
padding:0;
}
select{
margin:0;
}
textarea{
margin:0;
padding:0;
outline:0 清除选中状态下的蓝色外边框 使用
resize:none; 设定 用户无法自己调节大小
overflow:auto; 超出隐藏
}
表单新增类型:
用来填写邮件地址 | |
---|---|
url | 用来填写网址 |
range | 设置滑动条 |
date | 设置日期 |
month | 设置年月 |
week | 设置周数 |
time | 设置时间 |
datetime | 日期时间控件 |