HTML/CSS中可直接输数据的表格

和结合效果图：

在HTML/CSS 中，我们经常用HTML来布局和填充内容，用CSS来添加效果，修饰内容和布局，使整个页面变得更好看。

HTML和CSS的配合方法：

即在标签内添加CSS样式表的链接：

代码展示如下：

Make a Table Frame

CSS选择器

定义：

对带有指定属性的 HTML 元素设置样式。

注意：

只有在规定了 !DOCTYPE 时，IE7 和 IE8 才支持属性选择器。在 IE6 及更低的版本中，不支持属性选择。

功能：

“选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素。

CSS中的选择器有三个：

标签选择器、class类选择器、id选择器

1.标签选择器样式表：a{}、 div{}、table{} ...

2.class类选择器 样式表： .class{}

3. id选择器样式表： #d1 {}

【一个HTML标签只能绑定一个id属性,一个HTML标签可以绑定多个class属性】

单纯选择

标签的时候 是对全局的的（所有的）

进行修饰；

选择器优先级：

id选择器>class类选择器>标签选择器

所以有id和class 选择器的标签将不会被覆盖。交叉时是按照优先级覆盖显示的。

部分：电脑配件管理表2018年5月-8月

单纯的HTML 表格表单内容

标题标签：

表格的标题的内容填充（HTML）：

表格标题

标题的样式修饰(CSS)

table.formdata caption

{

text-shadow: #FF00ff;

text-align: center;

padding-bottom: 6px;

font-weight: bold;

}

其他标签相关内容可参考 HTML中表格的实例应用 一文。

部分：

form在网页中主要负责数据采集功能。

一个表单有三个基本组成部分：

（1）表单标签：包含了处理表单数据所用CGI程序的URL以及数据提交到服务器的方法。

（2）表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。

（3）表单按钮：提交按钮、复位按钮和一般按钮；用于将数据传送到服务器上的CGI脚本或者取消输入。还可以用表单按钮来控制其他定义了处理脚本的处理工作。

标签

定义：

标签规定用户可输入数据的输入字段。

根据不同的 type 属性，输入字段有多种形态。输入字段可以是文本字段、复选框、密码字段、单选按钮、按钮等等

语法代码：

实例代码：

关系展示：

中 submit属性 和reset属性

实例代码：

实例展示：

标签的其他属性值：

标签外是否添加标签？

input标签外是否添加form标签需要按情形区分：

应用场景的区别：

1.所有向后台提交数据（包括原生和ajax提交）的都建议用包裹.

2.如果只是用来做前台交互效果则不推荐使用form包裹。

但提交数据时，其实也可以不用form包裹input标签：

1.如果有form标签，在点击提交铵钮时，浏览器自动收集参数，并打包一个http请求到服务器，完成表单提交。在这一过程中，浏览器会根据method的不同，将参数编码后，放在urI中(get)，或者放在请求的data中(post)。然后发送到服务器。

2.如果没有form，post方式的提交要使用ajax手工完成。get方式的提交需要自己拼接url。

表单其他相关内容可参考 HTML中 表单 的应用实例 一文。

本文部分内容来自网络，如有侵权，请联系修改。