HTML表单格式化

一、说明

用table布局

二、效果

三、代码

 <!DOCTYPE html>

 <html>

 <head>

 <title>Form.html</title>

 <meta name="keywords" content="keyword1,keyword2,keyword3">

 <meta name="description" content="this is my page">

 <meta name="content-type" content="text/html; charset=UTF-8">

 <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->

 </head>

 <body>

     表单格式化

     <br>

     <form action="">

         <!--

              cellpadding 属性规定单元边沿与其内容之间的空白。

              注释：请勿将该属性与 cellspacing 属性相混淆，cellspacing 属性规定的是单元之间的空间。

              从实用角度出发，最好不要规定 cellpadding，而是使用 CSS 来添加内边距。

          -->

         <table border="1" bordercolor="#00ffff" cellpadding=10 cellspacing=0 width=400>

         <!-- 由此可见，<th>和<td>标签都是用于表格单元格显示的。不同的是<th>在单元格中加粗显示。 -->

             <tr>

                 <!-- 占两列 -->

                 <th colspan="2">注册表单</th>

             </tr>

             <tr>

                 <td>用户名称</td>

                 <td><input type="text" name="user" value=""><br /></td>

             </tr>

             <tr>

                 <td>输入密码</td>

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

             </tr>

             <tr>

                 <td>确认密码</td>

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

             </tr>

             <tr>

                 <td>选择性别</td>

                 <td>

                     <input type="radio" name="sex" value="nan"  />男

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

                 </td>

             </tr>

             <tr>

                 <td>选择技术</td>

                 <td>

                     <input type="checkbox" name="tech" value="java" />JAVA

                     <input type="checkbox" name="tech" value="html" />HTML

                     <input type="checkbox" name="tech" value="css" />CSS <br />

                 </td>

             </tr>

             <tr>

                 <td>选择国家</td>

                 <td>

                     <select name="country">

                         <option value="none" >--选择国家--</option>

                         <option value="usa" >美国</option>

                         <option value="en" >英国</option>

                         <!-- 默认选择中国 -->

                         <option value="cn" selected="selected">中国</option>

                     </select>

                 </td>

             </tr>

             <tr>

                 <th colspan="2">

                     <input type="reset" value="清除数据" />

                     <input type="submit" value="提交数据"/>

                 </th>

             </tr>

         </table>

     </form>

 </body>

 </html>

HTML表单格式化的更多相关文章

  1. 雷林鹏分享：jQuery EasyUI 表单 - 格式化下拉框

    jQuery EasyUI 表单 - 格式化下拉框 本教程向您展示如何创建一个简单的下拉框(Combobox),让它在下拉框中显示图片项.您可以在下拉框(combobox)上使用 formatter ...

  2. 表单格式化插件jquery.serializeJSON

    前言 前端在处理含有大量数据提交的表单时,除了使用Form直接提交刷新页面之外,经常碰到的需求是收集表单信息成数据对象,Ajax提交. 而在处理复杂的表单时,需要一个一个区手动判断处理字段值,显得非常 ...

  3. 获取表单内的所有元素的值 表单格式化插件jquery.serializeJSON

    简单描述:一个form表单里有十几个input或者select,要获取到他们的值,我的做法一直都是$("#id").val();这样做本来没什么说的,但是如果有很多呢,就很麻烦,看 ...

  4. Cleave.js – 自动格式化表单输入框的文本内容

    Cleave.js 有一个简单的目的:帮助你自动格式输入的文本内容. 这个想法是提供一个简单的方法来格式化您的输入数据以增加输入字段的可读性.通过使用这个库,您不需要编写任何正则表达式来控制输入文本的 ...

  5. css011 表格和表单的格式化

    css011 表格和表单的格式化 一.    让表格专司其职    Html中创建一个三行三列的表格 <table> <caption align="bottom" ...

  6. CSS3-animation，表格表单的格式化

    animation 1.与transition一样,animation在IE9之前都不支持,不仅如此,还需要大量的供应商前缀 2.定义关键帧:@内容中需要大量的前缀 @keyframes  fadeI ...

  7. iOS开发笔记11:表单键盘遮挡、浮点数价格格式化显示、省市区选择器、View Debugging

    1.表单键盘遮挡 应用场景为一个collectionView上有多个textfield.textView供用户填写信息. 之前输入项较少时,采取的方法比较粗暴,didSelectItemAtIndex ...

  8. 杂记-格式化Date默认格式,日期加一天,jstl判断字符类型,ajax模拟from表单后台跳转页面,jstl访问数据库并在页面显示

    1.格式化Date默认格式 String str="Sun Oct 08 22:36:45 CST 2017"; SimpleDateFormat sdf = new Simple ...

  9. 表单序列化json字符串和js时间格式化

    js时间格式化 new Date().format("时间格式") Date.prototype.format = function(fmt) { var o = {        ...

随机推荐

  1. CodeForces - 946D Timetable (分组背包+思维)

    题意 n天的课程,每天有m个时间单位.若时间i和j都有课,那么要在学校待\(j-i+1\)个时间.现在最多能翘k节课,问最少能在学校待多少时间. 分析 将一天的内容视作一个背包的组,可以预处理出该天内 ...

  2. CATiledLayer

    CATiledLayer 有些时候你可能需要绘制一个很大的图片,常见的例子就是一个高像素的照片或者是地球表面的详细地图.iOS应用通畅运行在内存受限的设备上,所以读取整个图片到内存中是不明智的.载入大 ...

  3. ASP.NET控件--DropDownList

      设置默认值:DropDownList1.Items[i].Selected=true;绑定:DropDownList1.DataSource = dataSet.Tables["Tabl ...

  4. linux常用命令：lsof 命令

    lsof(list open files) 是一个列出当前系统打开文件的工具.在linux环境下,任何事物都以文件的形式存在,通过文件不仅仅可以访问常规数据,还可以访问网络连接和硬件.所以 如传输控制 ...

  5. 精力管理 | 迅速恢复精力的N个技巧，四个关键词以及自我管理的方法和工具列表

    精力管理 | 迅速恢复精力的N个技巧,所谓坚持,是坚定的“持有”,这个“持”字很值得琢磨——不是扛.不是顶,而是“持”这样一个半放松的状态.如果你没做好自己该做的事情,如果你自己没有成长起来,随着年龄 ...

  6. python学习读取配置文件

    配置文件作为一种可读性很好的格式,非常适用于存储程序中的配置数据. 在每个配置文件中,配置数据会被分组(比如“config”和 “cmd”). 每个分组在其中指定对应的各个变量值.如下: # 定义co ...

  7. bzoj1660 / P2866 [USACO06NOV]糟糕的一天Bad Hair Day

    P2866 [USACO06NOV]糟糕的一天Bad Hair Day 奶牛题里好多单调栈..... 维护一个单调递减栈,存每只牛的高度和位置,顺便统计一下答案. #include<iostre ...

  8. Mysql截取和拆分字符串函数用法

    Mysql截取和拆分字符串函数用法 截取字符串函数: SUBSTRING(commentid,9) 意思是:从第9个字符开始截取到最后.SUBSTRING的参数有三个,最后一个是截取的长度,默认是到结 ...

  9. 经典模块化的前端框架：layer

    官网:http://layer.layui.com/ 官网论坛里有许多后台界面可参考下载.其中后台管理界面和弹窗功能都是比较常用的.

  10. 20145310《网络对抗》Exp9 Web安全基础实践

    基础问题回答 SQL注入攻击原理,如何防御? SQL注入攻击就是通过把SQL命令插入到Web表单递交或输入域名或页面请求的查询字符串,通过执行SQL语句进执行攻击者所要的操作. 如何防御?首先严格区分 ...