`

用CSS实现表单form布局实例

    博客分类:
  • css
 
阅读更多
<style type="text/css">
<!--
/* www.divcss5.com之css form实例 */
label{float: left;width: 80px;line-height:25px;}
form{margin:0px}
input{width: 180px;border:1px solid #808080;}

textarea{width: 250px;height: 150px;}

#sbutton{margin-left: 80px;margin-top: 5px;width:80px;}

br{clear: left;}
-->
</style>


<form action="" method="post">

<label for="user">姓名:</label>
<input type="text" id=user name="user" value="" /><br />

<label for="email">邮件:</label>
<input type="text" id=email name="email" value="" /><br />

<label for="comment">备注:</label>
<textarea id=comment name="comment">
</textarea><br />

<input type="submit" id="sbutton" value="确定" /><br />
</form>



[img][/img]
分享到:
评论

相关推荐

    html5+css3实现酷炫的form表单

    html5+css3实现酷炫的form表单

    请假表单实例

    请假表单(考勤集成) Temp/(考勤集成) - 副本.html

    HTML5实现表单自动验证功能实例代码

    在Html5中,通过对元素使用属性的方法,可以实现在表单提交时执行自动验证的功能,在执行代码后,将在表单提交时自动验证输入的内容是否为数字,如果验证通不过,将显示错误信息文字。 &lt;!DOCTYPE html&gt; &lt;...

    一些jQuery表单实例,Ajax表单判断

    摘要:脚本资源,jQuery,Ajax表单 收集的一些jQuery表单实例,Ajax表单判断,锋利的JQuery一书里的随书实例:  Demo 1 : form插件的使用--ajaxForm().  Demo 2 : form插件的使用---ajaxSubmit().  Demo 3 : form...

    jQuery+CSS美化一个漂亮的表单实例

    内容索引:脚本资源,jQuery,表单美化 jQuery+CSS美化出的一个漂亮的表单,用了jQuery1.2,有一个背景图片。已打包。  鼠标经过表单内的每一个输入框时自动切换背景,当前的输入框和其它的颜色是不一样的。

    CSS 表单

    一个表单案例,我们使用 CSS 来渲染 HTML 的表单元素: CSS 实例 input[type=text], select { width: 100%; padding: 12px 20px; margin: 8px 0; display: inline-block; border: 1px solid #ccc; border-radius: 4...

    一个简单的美化表单的实例

    一个我用过的css美化表单资源,不错的说。。。

    Bootstrap 实现表格样式、表单布局的实例代码

    1. 表格的一些样式 举例: &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head&gt;...link rel="stylesheet" href="./css/bootstrap.min.css"&gt; [removed][removed] &lt;/head&gt; &lt;body&gt; &lt;table

    PHP用正则匹配form表单中所有元素的类型和属性值实例代码

    最近工作中遇到一个需求,需要在正则匹配页面中,所有可能存在的 form 表单的元素,可能有 input,action,select,textarea等等所有可能的元素,本文给出一个代码示例。感兴趣的朋友们可以参考学习。 实例代码如下 ...

    使用Vuetify构建登录系统的UI并实现表单验证

    删除UserLoign.vue中style元素的样式定义,修改main.css,本实验中使用vue的样式类设置界面样式。复位按钮处理事件处理,在官方文档中我们可以看到,v-form组件中提供了数据清除的方法,这里我们使用组件功能。要...

    jQuery 表单验证插件formValidation实现个性化错误提示

    其效果图如下:使用说明 需要使用jQuery库文件和formValidation库文件[下载实例代码] http://jquery.com/ 同时需要自定义显示提示错误信息的CSS样式 使用实例 一,包含文件部分 代码如下:[removed][removed] ...

    Yii框架表单提交验证功能分析

    其次,使用css进行布局。 再次,使用js或jquery方式验证 最后,提交(get/post/ajax,目前较多使用jquery提交)。 注:该种方式由于较灵活,使用最多。 (2)原生form js或jquery方式验证,yii方式提交。 相对灵活 ...

    AngularJS学习笔记之表单验证功能实例详解

    本文实例讲述了AngularJS学习笔记之表单验证功能。分享给大家供大家参考,具体如下: 一、执行基本的表单验证 &lt;!DOCTYPE html&gt; &lt;html ng-app='exampleApp'&gt; &lt;head&gt; &lt;meta charset=UTF-8&gt; &...

    layui.js实现的表单验证功能示例

    本文实例讲述了layui.js实现的表单验证功能。分享给大家供大家参考,具体如下: 该示例可针对文本框,手机,邮箱,textarea等格式进行验证 首先引入如下文件: [removed][removed] [removed][removed] &lt;link rel...

    BootStrap表单验证实例代码

    下面给大家分享bootstrap表单验证实例代码,具体代码如下所示: &lt;&#37;@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%&gt; &lt;&#37;@ include file="../include/taglib....

    Bootstrap表单制作代码

    本文实例为大家分享了Bootstrap表单布局的具体代码,供大家参考,具体内容如下 Bootstrap 提供了下列类型的表单布局: 垂直表单(默认) 内联表单 水平表单 小妞妞做的表单实例: &lt;!DOCTYPE html&gt; &lt;...

    antd+react (后台实例)

    后台项目使用form表单+24栅格对页面进行优化摆脱css样式难以调整,实例和antd样式调整达到项目需求,沟通欠缺的小白勿扰,达到产品心中要求 满足客户需求 css样式统一调整 一种css颜色更改,就是一种风格总会有一种...

    H5用户注册表单页 注册模态框!

    本实例为大家分享了H5表单验证新特性,如何用户注册表单页,供大家参考,具体内容如下 &lt;!DOCTYPE html&gt; &lt;html&gt; &lt;head lang="en"&gt; &lt;meta charset="UTF-8"&gt; &lt;title&gt;用户注册表单页&lt;/...

Global site tag (gtag.js) - Google Analytics