table和form的使用，以及制作登录表单

table的简单使用

<table><caption>表格标题</caption><tr><th>列名一</th><th>列名二</th></tr><tr><td>数据一</td><td>数据二</td></tr>
</table>

效果如下

我们可以给table加上一些属性，边框和宽度和高度

<table width="100%" border="1"><caption>表格标题</caption><tr><th width="32%" height="120">列名一</th><th>列名二</th></tr><tr><td>数据一</td><td>数据二</td></tr>
</table>

效果如下

form的简单使用

form标签用于为用户输入创建 HTML 表单。
由文本框、密码框、多行文本框、单选、复选框、下拉菜单/列表、按钮、文件域、隐藏域等各种表单元素及其标记组成的。
表单用于向服务器传输数据。

<form name="表单名" method="提交方法" action="处理程序"><input  type="text" name="文本字段名称" maxlength=" " size=" " value="文本域">   <br><input  type="password"  name="密码字段名称" size=" "  maxlength=" " value="密码域" ><br >  <input type="radio" name=" " value="单选按钮" /><input type="radio" name=" " value=" " /><input type="radio" name=" " value=" " checked /><br >  <input type="checkbox" name=" " value="复选框"  /><input type="checkbox" name=" " value=" " checked /><input type="checkbox" name=" " value=" " checked /><br > <input type="submit" name=" " value="提交按钮"/><br><input type="reset" name=" " value="表单清空按钮"/><br><input type="image" src="./图像按钮.jpg"/><br><input type="file" name=" " size=" " maxlength=" "><br><input type="hidden" name=" "  value="隐藏域" /><br><select name="" size="" multiple><option value="" selected>下拉列表1</option><option value="">下拉列表2</option><option value="">下拉列表3</option></select>
</form>

效果如下

table+form制作的登录表单

制作如上表单

<table border="1"><form id="form1" name="form1" method="post" action=“hello.htm"><tr ><td  colspan="3" >学生信息注册</td></tr><tr><th>姓名：</th><th><input  type="text" name="文本字段名称" maxlength=" " size=" " value=" "></th><td width="80px"></td></tr><tr><th>性别：</th><th><input type="radio" name=" " value="单选按钮" />男<input type="radio" name=" " value="单选按钮" />女</th><td></td></tr><tr><th>出生日期：</th><th><input  type="text" name="文本字段名称" maxlength=" " size=" " value=" ">按YY—MM—DD</th><td></td></tr><tr><th>学校：</th><th><input  type="text" name="文本字段名称" maxlength=" " size=" " value=" "></th><td></td></tr><tr><th>专业</th><th><select name="" size="" multiple><option value="" selected>计算机科学与技术</option><option value="">软件工程</option><option value="">信息安全</option></th><td></td></select></tr><tr><th>体育特长</th><th><input type="checkbox" name=" " value="复选框"  />篮球<input type="checkbox" name=" " value="复选框"  />排球<input type="checkbox" name=" " value="复选框"  />足球<input type="checkbox" name=" " value="复选框"  />游泳</th><td></td></tr><tr><th>上传照片</th><th><input type="file" name=" " size=" " maxlength=" "></th><td></td></tr><tr><th>密码：</th><th><input  type="password"  name="密码字段名称" size=" "  maxlength=" " value="密码域" ></th><td></td></tr><tr><th>个人介绍</th><th height="100px"><input style="width: 280px;height: 90px;" type="text" name="文本字段名称" maxlength=" "  value=" "></th><td></td></tr></form>
</table>

table和form的使用，以及制作登录表单相关推荐

HTML5基础学习（7）：登录表单制作、表单知识补充
一.登录表单制作有的时候用户需要填写信息,然后把填写完的信息交给服务器.把数据提交给服务器的动作就需要一个新的知识点:表单. (1)常见的表单控件大部分的表单控件都是<input>编写 ...
前端学习之表格、简历制作及登录表单
简单表格制作 1.使用table标签 2.表格里的行用 tr 标签 3.单元格用 td 标签 <body><h3>前端技术阶段划分标准</h3> <tabl ...
Flutter 制作漂亮的登录表单
在本教程中,我将向您展示如何在 Flutter 和 Android studio 中制作漂亮的登录表单, 您将学习如何制作背景图像.如何在 Flutter中制作圆形按钮.如何添加一些不透明度以及如何添 ...
前端案例：简易登录表单的制作，包括用户名、密码、随机验证码（代码完整，复制即用）
案例效果本案例基于 vue.js 和 Element UI 实现.随机验证码采用 DOM 操作和 canvas 绘制,可随机生成和刷新:后续程序逻辑直接填入方法即可. Element UI 下载安 ...
Spring Security默认的用户登录表单页面源代码
Spring Security默认的用户登录表单页面源代码 <html><head><title>Login Page</title></hea ...
element-ui表单_每日UI挑战强加-登录表单（分步教程）
element-ui表单 A step by step journey to create a good design from the daily UI challenge 一步步走,从日常的UI挑 ...
javafx 表单_JavaFX 2：创建登录表单
javafx 表单在本教程中,我将使用JavaFX 2和CSS设计一个外观漂亮的Login Form . 它是经典的登录表单,带有用户名和密码以及登录按钮. 为了遵循本教程,我强烈建议您查看以下这些 ...
JavaFX 2：创建登录表单
在本教程中,我将使用JavaFX 2和CSS设计漂亮的Login Form . 它是经典的登录表单,带有用户名和密码以及登录按钮. 为了遵循本教程,我强烈建议您查看以下这些教程: Eclipse ID ...
【转】4.2使用jQuery.form插件，实现完美的表单异步提交
传送门:异步编程系列目录-- 示例下载:使用jQuery.form插件,实现完美的表单异步提交.rar 抓住6月份的尾巴,今天的主题是今天我想介绍的是一款jQuery的插件:Jquery.form. ...

table和form的使用，以及制作登录表单

table的简单使用

form的简单使用

table+form制作的登录表单

table和form的使用，以及制作登录表单相关推荐

最新文章

热门文章