三个使用的目的:
表格作用:
表格
01创建表格
创建好表格以后只是形式上是表格,但是没有真正画出表格来
table的作用只是创建表格最外层的长方形
02表格属性
表格属性添加位置:
03表头单元格标签th
04表格标题caption
这个的好处是标题会跟着表格一起走
例子:
效果:
05合并单元格
以下就是靠合并单元格实现的:
合并单元格的两种方式:
合并单元格顺序:
合并单元格三部曲:
把其他几个单元格合并到目标单元格以后被合并的就会多出来,所以要删除掉他们
例子(刘德华那个表格):
06表格划分结构
划分了以后我们就可以在检查的时候看清楚表格的结构
这三个结构不一定说全要写哦!
注意;
例子:
tbody,tfoot同理
列表
表格一般用于数据的显示,但是网页中有很多类似表格的布局:
这时候我们就要用到列表 ,列表中没有行的概念,我们的单元格想怎么放就怎么放
01无序列表
元素间摆放的顺序随意时,我们一般用无序的
比如说以下这几种也用无序列表:
02有序列表
例子:
效果:
03自定义列表
例子:
效果:
我们以后见到这种解释说明的结构就用自定义列表
表单
表单控件就是可以输入内容的框
表单域就是用户写完信息提交的时候不是一条一条来的,而是把整个表单域一次性提交
01input
语法:
常用属性:
radio
当type的值是radio的时候,就是我们只能从给定的选项中选一个
只有加上相同的name属性我们选中哪个给后台送哪个
不加name两个选项都可以选中?????
checkbox
我们有多个选项可以同时选择,一般也加上相同name值,是同一类型的name就弄成一样的
checked
想让那个被选中就在那个input属性里面加这么一句话
页面加载好以后男就被选中
button
在按钮中我们一般就需要value来让用户知道这个按钮是做什么的
image
按钮变成图片,包括按钮中的文字都是图片完成
file
这个按钮会打开我们电脑中的文件,选中文件后就i可以上传至页面
value是决定了输入框初始显示什么字,但是这个字不会当我们输入的时候自动消失
name属性是当我们两个表单输入内容的意思大致相似的时候为了区分两个表单给他们起名字,主要是对于后台可以通过这个属性找到这个表单,几乎每个表单都写上name吧,为了区分不同的表单,特例是当表单类型是单选或者复选的时候name是相同的:
有了name值我们后台才能收到数据,所以name一定要写
02lable
作用:
用法:
用户点击”用户名"也可以出现光标
03textarea控件(文本域)
当我们框框中输入的内容比较多的时候,我们就用这个
我们一般用css来修改文本框大小
04select下拉列表
select我们现在一般不用,他在不同浏览器中效果不同而且我们很难改变它的样式,这种形式我们一般用div和li做出来
效果如下:
第一个option的内容就是我们框中首先出现的内容,所以我们提示性的文字写在第一个option中
如果我们想要北京成为默认选项 ,我们就:
05form表单域
重置按钮也只是在有了form表单域的时候有效果
我们如果选择method是get,输入的信息结合name属性就会 显示出来:
而用post方式则不会: