表格：

1.表格在body里的结构

<thead></thead>不用了

<tbody>可以不写，浏览器会自动添加

<tr>

</tr>

<tr>

</tr>

<tbody>可以不写，浏览器会自动添加

<tfoot></tfoot>不用了

</table>

解释：

border：是table的属性，可以设置表格和每个单元格的边框，和css样式里的border是不一样的

width和height可以设置表格整体宽高

cellspacing每一个单元格的间距

cellpadding给每一个单元格加内边距

tr代表一行

th是每列的标题，存在于第一行

td代表每一行有多少单元格

2.table的高度和宽度

1⃣️宽度

可以设置td的宽度，当td的总宽度超过整个表格的宽度之后，会按比例分配；

单独设置某几个td宽度的时候，宽度有效，没有设置宽度的td分配剩余的宽度

2⃣️高度

可以设置td的高度，总高度超过table的高度之后，会把table的高度撑开

3.合并单元格

1⃣️<th colspan="2"></th>跨列、合并的列数，横向

2⃣️<th rowspan="2"></th>跨行、合并的行数，竖向

4.table在head里面的内部样式设置

table{

border：5px solid red；

empty-cells：show；

隐藏空的单元格：show展示、hide隐藏；

border-collapse：collapse；

合并相邻单元格边框

}

表单

1.form标签

表单的所有标签都写在form标签内部

其属性与属性之间用空格隔开

2.<label for="username">用户名</label>

<label> 标签为 input 元素定义标注（标记）。

label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。

<label> 标签的for 属性应当与相关元素的id 属性相同。

3.文本输入框

1⃣name属性用来告诉服务器这个输入框的内容是哪个字段；

2⃣placeholder用来提示输入内容。

4.密码输入框<inputtype="password"/>

5.单选框；checked已选中

6.复选框<inputtype="checkbox"/>

7.文件上传；multiple上传多个文件

8.能点击的按钮<inputtype="button" value="按钮名称"/>

9.设置隐藏字段，用于提交一些不需要用户填写的信息，比如：注册时间

10.重置按钮，清空用户写入的内容

11.文本区域，发表意见什么的其他文本

cols：控制行数（宽度）

rows：控制列数（高度）行宽列高

resize可否由用户调整元素的尺寸，none用户无法调整元素的尺寸；both可调整高度和宽度；horizontal可调整宽度；vertical可调整高度

12.下拉选项框，selected已选择

</select>

13.提交按钮

14.图片类型的提交按钮，也有提交功能

15.value的定义和用法

value 属性为 input 元素设定值。

对于不同的输入类型，value 属性的用法也不同：

type="button", "reset", "submit" - 定义按钮上的显示的文本

type="text", "password", "hidden" - 定义输入字段的初始值

type="checkbox", "radio", "image" - 定义与输入相关联的值

注释：<input type="checkbox"> 和 <input type="radio"> 中必须设置 value 属性。

表单的新属性

1.<input type="tel"/>，电话号码输入框

2.number，用于输入数字

3.search，用于提示用户要搜索的文字，search和text之间的区别主要在于样式

text是方框，search是带有圆角的框

4.url，用于输入单个网址

5.email，用于输入单个电子邮件地址，如果指定了multiple属性，就可以输入多个电子邮件地址，以逗号隔开

6.datetime，慎用！用于输入时区设置为UTC的日期和时间

7.date，用于输入不含时区的日期

8.month，用于输入含年份但不含时区的日期

9.week，用于输入含年份和周数但不含时区的日期，列如：此格式的日期2011-W05表示2011年的第5周

10.time，用于输入含小时、分钟、秒和秒的小数点部分但不含时区的时间值

11.datetime-local，用于输入不含时区的日期和时间

12.range，用于输入数字，但与number的区别在于无需输入具体数字，在大部分支持该类型的浏览器中，范围控件的实施形式为滑块

13.color，用于通过颜色池控件选择颜色

14.datalist

<datalist> 标签定义选项列表。请与 input 元素配合使用该元素，来定义 input 可能的值。

datalist 及其选项不会被显示出来，它仅仅是合法的输入值列表。

请使用 input 元素的 list 属性来绑定 datalist。

</datalist>

15.autofocus：

规定输入字段在页面加载时是否获得焦点，

取值：autofocus

16.placeholder：

规定帮助用户填写输入字段的提示

取值：text

17.required

规定输入字段的值是必须的

取值：required

18.autocomplete

规定是否使用输入字段的自动完成功能

取值：on、off

19.form

规定输入字段所属的一个或多个表单

取值：formname

20.pattern

规定输入字段的值的模式或格式

例如：pattern=[0-9]表示输入值必须是0与9之间的数字

取值：regexp_pattern

HTML表格、表单，以及新表单属性相关推荐

php数据表相同字段合并,php实现两表合并成新表并且有序排列的方法
这篇文章主要介绍了php实现两表合并成新表并且有序排列的方法,涉及针对数组的遍历与排序操作技巧,具有一定的实用价值,需要的朋友可以参考下本文实例讲述了php实现两表合并成新表并且有序排列的方法.分享 ...
php拷贝mysql表_MySQL复制表数据或表结构到新表中
MySQL复制表数据到新表的几个步骤. 1.MySQL复制表结构及数据到新表 CREATE TABLE new_table SELECT * FROM old_table; 2.只复制 MySQL复制 ...
mysql 用命令行复制表数据到新表
MySQL用命令行复制表的方法 mysql中用命令行复制表结构的方法主要有一下几种: 1.只复制表结构到新表 1 CREATE TABLE 新表 SELECT * FROM 旧表 WHERE 1=2; ...
mysql 复制表结构到一个新表_MySQL复制表数据或表结构到新表中
MySQL复制表数据到新表的几个步骤. 1.MySQL复制表结构及数据到新表 CREATE TABLE new_table SELECT * FROM old_table; 2.只复制 MySQL复制 ...
MySQL 新增表中的数据为另外一个或多个表的数据（业务场景：创建关系表，复制旧表数据到新表）
问题昨天同学问了我个问题我想写个sql脚本,循环插入数据,数据是另一个表中的a.b字段 A表中的a.b字段数据,循环加入B表中a.b字段.就是这个意思我问他为什么不用Java写,他说是数据维护, ...
HTML day_02(6.1)表格列表、结构标记、表单、新表单元素
一.表格 1.表格的结构 2.表格的语法 table标签:表示表格的开始和结束,表格的所有内容需要写在这一对标签中 tr标签:表示表格中的一行 table row td标签:要写在tr中,这一行中的每 ...
C#中将原表复制到新表
源程序来自网络上的资源,我记录下来用于以后忘记之用.对大家也许有用 //表dataTableSource获取数据 string ConnectionString = "P ...
thinkphp更新mysql数据库表_ThinkPHP 创建新表、创建数据库讲解
很多时候我们想通过ThinkPHP 创建新表,或者创建数据库,很多时候我们往往把事情想得复杂了,其实我们太依赖于框架以至于忘了最原始的东西--通过最原始的PHP来创建新表是完全可以的. 通过PHP/T ...
MySql中，复制旧表结构到新表
# 创建学生表 create table student(age int,name varchar(32))engine myisam charset utf8; insert into studen ...
MySQL单表查询与多表联查
1. 创建表数据表的每行称为一条记录(record):每一列称为一个字段(field)[列之间以英文逗号隔开]. 简单语法:在当前数据库中创建一张表CREATE TABLE 表名(列名列数据类型, ...

HTML表格、表单，以及新表单属性

表格：

表单

表单的新属性

HTML表格、表单，以及新表单属性相关推荐

最新文章

热门文章