HTML表格表单制作
1.数据表格的作用及组成
作用：显示数据，展示数据
组成：
<table>用于定义表格的标签
<tr>行
<th>内容<th>表头单元格
<td>内容</td>单元格
<td>内容<td>单元格
....
<tr>
</table>
1.<table></table>是用于定义表格的标签
2.<tr><tr>标签用于定义表格中的行，必须嵌套在<table></table>标签里面
3.<td></td>用于定义表格中的单元格，必须嵌套在<tr><tr>标签中
4.td代表表格数据（tabledata），即数据单元格的内容
5.<th>标签表示html表格的表头部分，一般位于第一行或第一列，表头单元格文本自动加粗
6.补充标签：<thead></thead>:用于定义表格的头部，<thead>标签内必须拥有<tr>标签，一般是位于第一行
<tbody></tbody>:用于定义表格的主体，主要用于放数据本体
7.以上标签都是放在<table></table>当中
2.表格的相关属性
width="宽" height="高"
border=“添加表格边框，表格边框大小”
cellspacing="单元格间距离"
cellpadding="单元格与内容之间的距离"
bgcolor="表格背景色“
align="表格对齐方式"（left/center/right）
合并单元格属性：
colspan="所要合并单元格列数”合并列，左右合并
rowspan="所要合并单元格行数”合并行，上下合并
3.合并单元格三部曲
1.先确定合并行还是合并列
2.找到目标单元格，写上合并方式=合并的单元格数量，比如：<td colspan="2"></td>
3.删除多余的单元格
表单制作
1.表单的作用：用来收集用户信息。
在html当中，一个完整的表单通常由，表单域、表单控件（也称为表单元素）、和提示信息3部分 组成
2.表单域：method提交方法 提交方式（post,get)
<form action="#" name=“表单名称” method="post" >
各种表单元素控件
</form>
get和post的区别:
1. Get是不安全的，因为在传输过程，数据被放在请求的URL中；Post的所有操作对用户来说都是不可见的。 2. Get传送的数据量较小，这主要是因为受URL长度限制；Post传送的数据量较大，一般被默认为不受限制。 3. Get限制Form表单的数据集的值必须为ASCII字符；而Post支持整个ISO10646字符集。 4. Get执行效率却比Post方法好。Get是form提交的默认方法。
3.文本框
<input type ="text" value="默认值“ placeholder="输入框内容/ maxlength="限制输入数量 >
4.密码框
<input type="password"/ “ placeholder="输入框内容 maxlength="限制输入数量>
5.提交按钮
<input type="submit" value="按钮内容"/>
6.重置按钮
<input type="reset" value="按钮内容"/>
7.禁用按钮 disable="disabled"(简写disabled)
8.默认选项 checked="checked"(简写checked)
9.下拉菜单
<select>
<option>菜单内容</option>
<option>菜单内容</option>
<option selected(默认选中)>菜单内容</option>
<option disabled(禁选)>菜单内容</option>
</select>
selected默认 disabled禁选
10.多行文本框
<textarea></textarea>
11.占位 placeholder="内容"
12.按钮 <input type="button" value="按钮内容"/>
button：只起到跳转作用，不进行提交，后期配合JS搭配使用。
submit：是提交按钮 起到提交信息的作用
file：文件域，使用场景，上传文件使用 <input type="file" value="按钮内容"/>
13.单选框
男<input type="radio" name="ral" value="男“/>
女<input type="radio" name="ral" value="女“ />
单选按钮里的name属性必须写，同一组单选按钮的name属性值必须一样。
14.复选框
<input type="checkbox" name="like" value="默认值“/>
<input type="checkbox" name="like" disabled="disabled">
(disabled="disabled" :禁用)
(checked="checked" :默认选中)
男<input type="radio" name="ral" value="默认值“ checked="checked" />
15.<lable>标签
<lable>标签为input元素定义标注（标签）
<lable>标签用于绑定一个表单元素，当点击<lable>标签内的文本时，浏览器就会自动将焦点（光标） 转到或者选择对应的表单元素上，用来增加用户体验
语法：<input type="radio" name="sex" id="sex"><lable for="sex" >男</lable>
核心：lable标签的for属性应当与相关元素的id属性相同
HTML表格表单制作相关推荐
- html如何制作一个漂亮的表格？+ 列表制作 + 表单制作（干货！直接收代码）
https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注! 欢迎关注微信公众号:宝藏女孩的成长日记 如有转载,请注明出处(如不注明,盗者必究) 目录 html如何 ...
- 从零开始学前端：表单制作 --- 今天你学习了吗？（CSS：Day05）
从零开始学前端:程序猿小白也可以完全掌握!-今天你学习了吗?(CSS) 复习:从零开始学前端:表格制作 - 今天你学习了吗?(CSS:Day04) 文章目录 从零开始学前端:程序猿小白也可以完全掌握! ...
- Bootstrap框架(基础篇)之列表,表格,表单
继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul><li>-& ...
- HTML5基础学习（7）：登录表单制作、表单知识补充
一.登录表单制作 有的时候用户需要填写信息,然后把填写完的信息交给服务器.把数据提交给服务器的动作就需要一个新的知识点:表单. (1)常见的表单控件 大部分的表单控件都是<input>编写 ...
- 2017-2-15从0开始前端学习笔记（HTML）-图片-表格-表单
2017-2-15从0开始前端学习笔记-图片-表格-表单 标签 图片 图片<img src="#" alt="文本说明 不能加载图片时显示" title= ...
- 定义列表的特点html,HTML的列表表格表单知识点
无序列表格式 ...
- DedeCMS自定义表单制作和调用办法
http://down.chinaz.com/try/201112/1471_1.htm 在很多建站需求中,需要一些额外的表单供前台用户提交,以便于收集.统计.分析及处理更多的数据,比如:在线订单.在 ...
- 推荐使用什么样的平台表单制作工具好？
在办公自动化迅猛发展的今天,传统的表单制作工具已经不能满足各行各业的生产需求,引用专业的低代码开发平台表单制作工具可以助力企业提高作业协作效率.那么,什么平台的表单制作工具可以实现这一目的?今天,我们 ...
- vue.js 表格表单序号
vue.js 表格表单序号 表格是动态的,通过v-for="(item,index) in sites" 循环出来的表格 ,通过index属性,实现表格序号自增, 结合页码和每页数 ...
- mysql 自定义表单_DedeCMS自定义表单制作和调用办法
在很多建站需求中,需要一些额外的表单供前台用户提交,以便于收集.统计.分析及处理更多的数据,比如:在线订单.在线报名等一些常见的互动应用. dedecms自定义表单调用 先说怎么调用自定义表单吧,因为 ...
最新文章
- Java中伪造referer来获取数据
- 使用SMW0上传EXCEL模板遇到的问题
- ios 监听一个控制器的属性_OC观察者模式之KVO的使用与思考
- 云上应用系统数据存储架构演进
- Ajax_HTTP请求以及响应
- git GUI管理工具 sourcetree使用
- 如何使用excel快速下载网页图片？
- 2008年全国大学生数学建模D题（加附件）
- android爬取英文单词发音，并在app中播放。（使用百度接口）
- 海德也离开了，祝你一路顺风。
- 微信小程序请求php文件报错,微信小程序wx.request请求数据报错
- 所发生的分手快乐东风
- 网易中国创业家大赛倒计时，2017年8月报名结束
- 容联云的测试未上线手机号报错
- 让 Windows XP 不用输入密码自动登录
- C语言函数：错误信息打印函数,strerror()与perror()
- Unity导出微信小游戏
- 好文回顾：中国游戏编年史 中国游戏的二十年(5)
- 高防CDN如何防护CC攻击
- 必然与偶然，本质与细节