表格(table)表单(form)(课堂总结、练习总结)

原创 路侥知马力 随笔 前端代码 184阅读 2017-11-22 00:27:30 举报

今日笔记:

1.表格标签:
table 表格
thead 表格头
th 元素定义表头
tbody 表格主体
tr 表格行
td 元素定义表格单元

2.colspan 属性规定单元格可横跨的列数。<td colspan="2"></td>

3.表格样式重置
table{border-collapse:collapse;} 单元格间隙合并
th,td{padding:0;}重置单元格默认填充

4.rowspan 属性规定单元格可横跨的行数。<td rowspan="2"></td>
5.form 表单
action数据提交的地址
method提交类型
GET POST
所有的表单控件都需要被form包裹
form可以包裹多个表单控件
<input type="…… " name="" value="" />
text 文本框
password 密码
radio 单选
将同类型的radio设置同一个name就能达到互斥效果
checkbox 复选(多选)
submit 提交
reset 重置
button 按钮
file 上传
hidden 隐藏

    键值对

    name属性,提交数据时显示的字段(参数)
    value属性
        设置表单控件的值(页面加载就会展示)
        提交数据时具体的值

6.abel 标签为 input 元素定义标注
<input type="checkbox" name="" id="a"/>
<label for="a">……</label>
checked 在页面加载时默认选定的 input 元素。
<input type="checkbox" name="" checked/>
disabled 属性规定应该禁用 input 元素。
<input type="checkbox" name="" disabled/>

7.select/option 下拉选框
对高度的支持不兼容;
所设置的宽度是包含边框的大小
textarea 文本域
各个浏览器下的默认滚动条显示不兼容
####今日练习
1.表格练习(图一)####
出现问题:表格后两行tr应该和上边的有个空白的距离,没有做出来。
解决办法:明天老师上课讲解,认真听讲。重新再做一遍,巩固一下

表格(table)表单(form)(课堂总结、练习总结)
1.表单练习(图三)####
出现问题:整个页面都是迷迷糊糊地打出来的。还是有好多问题,表单应用的不懂得,input里边可以加div吗,或者input外边可以加div吗?等等,还是有点迷迷糊糊地,不敢用表单,不敢下手写代码
解决办法:明天老师上课讲解,认真听讲。重新再做一遍,巩固一下。

表格(table)表单(form)(课堂总结、练习总结)

评论 ( 1 )
最新评论
1752291168 2017-11-22 11:37:23 1F

input是单标签,只能放到其他块级标签中