表格表单

Posted 2020-06-16

表格标签：

table 表格

thead 表格头

tbody 表格主体

tr 表格行 

th 元素定义表头

td 元素定义表格单元 （table data cell）

 

表格样式重置 

table{ border-collapse:collapse;}单元格间隙合并

th,td{padding:0} 重置单元格默认填充

 

单元格合并

colspan 属性规定单元格可横跨的列数  <td colspan="2"></td> 注意：在本tr内删除多余的td

  rowspan 属性规定单元格可横跨的行数 <td rowspan="2"></td> 注意：

删除本tr外多余的td 

form表单

<form action="提交地址">
    <input type=".." name="" value""/>
</form>

type= 

text(文本框) password(密码)radio(单选)checkbox(复选)submit(提交)reset(重置)button(按钮)image(图片)file(上传)hidden(隐藏)

  name=

text(文本框) password(密码)类型：与后端对应

radio(单选)：分组类型，同名互斥

  checkbox(复选)：分组类型

 

表单元素

label 标签为input元素定义标注

<input type=".." name=".." value="" id="jill"/>

<label for="jill">label中的for的值关联input里id的值</label> 

for 的优点：更好的用户体验  

 

checked 在页面加载时默认选定的input元素

<input type="checkbox" name=".." value="" checked/> 

 

disabled 属性规定应该禁用input元素

<input type=".." name=".." value="" disabled/> 

 

select/option 下拉选框

对高度的支持不兼容

 

textarea 文本域

各个浏览器下的默认滚动条显示不兼容，css3新怎resize调整尺寸属性