HTML <table> 标签

border pixels 规定表格边框的宽度。 STF
cellpadding
  • pixels
  • %
 规定单元边沿与其内容之间的空白。 STF
cellspacing
  • pixels
  • %
 规定单元格之间的空白。 STF

HTML 5 <form> 标签

action 定义一个 URL。

当点击提交button时。向这个 URL 发送数据。
method 用于向 action URL 发送数据的 HTTP 方法。默认是 get。

HTML <input> 标签的 type 属性

button 定义可点击button（多数情况下。用于通过 JavaScript 启动脚本）。
checkbox 定义复选框。
file 定义输入字段和 "浏览"button，供文件上传。
hidden 定义隐藏的输入字段。
image 定义图像形式的提交button。
password 定义password字段。该字段中的字符被掩码。
radio 定义单选button。
reset 定义重置button。重置button会清除表单中的全部数据。
submit 定义提交button。

提交button会把表单数据发送到server。
text 定义单行的输入字段，用户可在当中输入文本。默认宽度为 20 个字符。

HTML <input> 标签的 checked 属性

checked 属性规定在页面载入时应该被预先选定的 input 元素。

checked 属性 与 <input type="checkbox"> 或 <input type="radio"> 配合使用。

HTML <option> 标签的 selected 属性

elected 属性规定在页面载入时预先选定该选项。

被预选的选项会显示在下拉列表最前面的位置。

综合案例：

<html>

	<head>

		<meta http-equiv="Content-type" content="text/html;charset=utf-8"/>

		<meta http-equiv="refresh" contnt="3;uri=http://baidu.com"/>

		<title> hello world!</title>

	</head>

	<body>

		<form action="#" method="get">

			<table align="center" border='0' cellspacing="10" cellpadding="10">

				<input type="hidden" name="id" value="id"/>

				<tr>

					<td>username：</td>

					<td><input type="text" name="userName" value="" /></td>

				</tr>

				<tr>

					<td>密码：</td>

					<td><input type="password" name="password" /><br/></td>

				</tr>

				<tr>

					<td>爱好：</td>

					<td>

						<input type="checkbox" name="hobby" value="film" checked="checked">电影

						<input type="checkbox" name="hobby" value="net">上网<br/>

					</td>

				</tr>

				<tr>

					<td>性别：</td>

					<td>

						<input type="radio" name="sex" checked="checked"/>男

						 <input type="radio" name="sex"/>女<br/>

					</td>

				</tr>

				<tr>

					<td>头像：</td>

					<td>

						<input type="file" name="img"/><br/>

						<select name="list">

							<option value="aaa">aaa</option>

							<option value="aaa" selected="selected">bbb</option>

							<option value="aaa">ccc</option>

						</select><br/>

					</td>

				</tr>

				<tr>

					<td>个人介绍：</td>

					<td><textarea rows="5" cols="20"></textarea><br/></td>

				</tr>

				<tr>

					<td colspan="2" align="center">

						<input type="submit" value="揭交"/>

						<input type="reset" value="重置"/>

					</td>

				</tr>

			</table>

		</form>

	</body>

</html>



watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvbGlhbmc1NjMw/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast" alt="">

form表单和表格的更多相关文章

  1. form表单reset表格并执行搜索

    其中reset() 不需要定义 search():是你执行的搜索的函数 <html> <head> <title>sf</title></head ...

  2. Unit 2.前端之html--table(表格),form(表单)标签

    一.table标签 作用:定义html表格.一个table标签元素至少包含 thead(表头),tbody(表主题),还可以有tfoot(表底部) html表格游table元素及一个或者多个tr,th ...

  3. 【HTML】--- 列表、表格、form表单标签

    Html常用标签(2) 上篇博客讲了些常用的html标签 :[HTML]---常用标签(1) 这里主要讲 列表.表格标签和 form表单标签. 一.列表.表格标签 1.列表标签 概念 把内容以列表的形 ...

  4. vue+element创建动态的form表单.以及动态生成表格的行和列

    动态创建form表单,网上有插件 (form-create) 不过我不知道它怎么用,没有使用成功,如果你使用成功了,欢迎下方留言. 最后我使用了笨方法,针对各个表单写好通用的组件,然后根据type用v ...

  5. HTML之表格标签和form表单

    表格标签: table 一般用于信息展示 tr行 td文本单元格 th标题单元格(文本加粗) table属性: cellspacing:单元格间距,一般设置为0 cellpadding:文字到边框的距 ...

  6. fsLayuiPlugin数据表格弹出form表单说明

    fsLayuiPlugin 是一个基于layui的快速开发插件,支持数据表格增删改查操作,提供通用的组件,通过配置html实现数据请求,减少前端js重复开发的工作. GitHub下载 码云下载 测试环 ...

  7. Vue + Element-ui实现后台管理系统(5)---封装一个Form表单组件和Table表格组件

    封装一个Form表单组件和Table组件 有关后台管理系统之前写过四遍博客,看这篇之前最好先看下这四篇博客.另外这里只展示关键部分代码,项目代码放在github上: mall-manage-syste ...

  8. 如何把整张表格的数据通过form表单的方式传回后台

    开发背景: 前段时间遇到这么一个需求,就是把一整张表格的数据存储在数据库中,之后再渲染在页面中,还可以进行重新编辑. 例如下边的课程表(为了方便,所以都是软件工程). 我也是经过一段时间的思考,才实现 ...

  9. 数据表格，查询、导出共用一个form表单，实现文件流方式下载

    在开发中遇到问题是这样的: 在维护老的管理系统的过程中,老板说让加导出功能:项目中,查询的筛选条件是用的表单提交的方式写的. 解决方案有两种: 一.用ajax方式导出 var array = $('# ...

随机推荐

  1. Android SurfaceView实战 带你玩转flabby bird （下）

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/43063331,本文出自:[张鸿洋的博客] 1.概述 在Android Surfa ...

  2. LDF文件过大的解决办法

    检查扎兰屯服务器的时候,发现其中一个分区的原空间有300多个G,但只余下了80多个G.检查了一下,发现某库ldf文件过大,竟然达到了280多个G. 这如何得了,再这样下去,硬盘怎能受得了? 尝试用收缩 ...

  3. net use \\192.168.54.145 /user:administrator "12345qwert"无法连接，错误码1326

    1.在远程机的"控制面板-文件夹选项-查看-简单的文件共享",去掉选取,然后再尝试连接 2.控制面板\所有控制面板项\管理工具 下-->本地安全策略-->安全设置--& ...

  4. ant_0105

    在projectA中执行projectB的构件文件.projectA的构件文件内容如下 <?xml version="1.0"?> <!-- 在projectA中 ...

  5. 10-IOSCore - 应用间通信、本地通知

    一.应用间通信 URL 调用系统服务: tel:11111 sms:xxx@163.com http:// URL深入 类型://主机:端口/地址?参数 label框等于文字大小快捷键:command ...

  6. Qt线程QThread简析（8个线程等级，在UI线程里可调用thread->wait()等待线程结束，exit()可直接退出线程，setStackSize设置线程堆栈，首次见到Qt::HANDLE，QThreadData和QThreadPrivate）

    QThread实例代表一个线程,我们可以重新实现QThread::run(),要新建一个线程,我们应该先继承QThread并重新实现run()函数. 需要注意的是: 1.必须在创建QThread对象之 ...

  7. 从底层简析Python程序的执行过程

    摘要:是否想在Python解释器的内部晃悠一圈?是不是想实现一个Python代码执行的追踪器?没有基础?不要怕,这篇文章让你初窥Python底层的奥妙. [编者按]下面博文将带你创建一个字节码级别的追 ...

  8. 【COCOS2D-HTML5 开发之三】演示样例项目附源代码及执行的GIF效果图

    本站文章均为李华明Himi原创,转载务必在明显处注明:(作者新浪微博:@李华明Himi) 转载自[黑米GameDev街区] 原文链接: http://www.himigame.com/cocos2d- ...

  9. 设计模式（Abstract Factory）抽象工厂

    1. 需求: 设计一个电脑组装程序,对于组装品牌电脑. 用零件组装(主板.硬盘.显示器)由品牌提供的所有. 让我们组装一台联想电脑,板子.由联想提供. (眼下仅仅有Lenovo和Dell两种品牌) 2 ...

  10. Swift - 使用HTML5进行iOS开发（将HTML5打包成iOS应用）

    最近越来越流行使用HTML5进行跨平台应用开发,先不说运行效率如何.从人力成本来说,只要写一套html页面就可以打包发布到安卓和iOS等多个平台,确实会省下不少时间和人力(这个领导最喜欢了). 下面简 ...