熟悉常用表单格式的五个技巧

技巧

  想必大家在页面都使用过表单,如果你对单调的表单控制单元不满意,不妨看看以下几条技巧:

  1、表单文本输入的移动选择:在文本输入栏中,如果加入了提示,来访者往往要用鼠标选取后删除,再输入有用的信息。其实只要加入 代码到 <textarea> 中,一切就会变得简单多了,如:

<textarea name=textarea wrap=virtual rows=2 cols=22 >Input English..</textarea>

  类似的,可以加入代码到<input>。

  2、表单输入单元点击删除:本列同上则作用类似,只是使用鼠标上略有变化,需要点击而不像上则的只要鼠标覆盖。如:

<input type=text name="address" size=19 value="Enter,e-mail...">

  点击输入单元后,提示信息会删除,是不是很方便。

  3、表单输入单元的边框设置:更改传统的表单单元边框,会让你的主页生色不少。如:

<input type=radio name=action value=subscribe checked style="BORDER-BOTTOM: dashed 1px; BORDER-LEFT: dashed 1px; BORDER-RIGHT: dashed 1px; BORDER-TOP: dashed 1px;background-color: #FEF5C8">

  其中"style=***"为左右上下和背景色设置,适用于其它单元,请读者亲自试试。

  4、表单输入单元的文字设置:表单中单元的字体是可以修改的,如:

<input type=text name="address" size=19 value="Enter,e-mail..." style=font-family:"verdana";font-size:10px >

  其中"style=***"为字体和字大小设置。

  5、修改表单属性为弹出窗口:大多数表单激活后,会在当前页面中打开,影响正常浏览。不如修改一下,如:

<form method=POST action=url target=_blank>

  其中"target=_blank"为控制在弹出窗口打开。

时间: 2024-11-02 00:52:56

熟悉常用表单格式的五个技巧的相关文章

熟悉常用表单格式的五点技巧

技巧 想必大家在页面都使用过表单,如果你对单调的表单控制单元不满意,不妨看看以下几条技巧: 1.表单文本输入的移动选择:在文本输入栏中,如果加入了提示,来访者往往要用鼠标选取后删除,再输入有用的信息.其实只要加入 代码到 <textarea> 中,一切就会变得简单多了,如:<textarea name=textarea wrap=virtual rows=2 cols=22 >Input English..</textarea> 类似的,可以加入代码到<input

JS常用表单验证方法总结_javascript技巧

复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"

js 各种常用表单验证正则函数(数字,邮箱,整数,小数)

js 各种常用表单验证正则函数(数字,邮箱,整数,小数)日期等 /************************************************     验证各种数据格式 *************************************************/ //为数字添加, function formatnum(v){     var reg = /(?=(?!b)(ddd)+(?!d))/g;     return v.replace(reg,','); }

Extjs中常用表单介绍与应用_extjs

目标: 知道表单面板如何创建 了解表单面板中xtype的类型的应用 知道表单面板如何验证,绑定,取值 综合应用表单面板(玩转它) 内容: 首先我们要理解的是FormPanel也是继承panel组件的.所以它有着panel的属性 要创建一个表单面板其实很简单 var MyformPanel=new Ext.form.formpanel(); 表单面板和面板一样只是作为一个容器出现的,需要我们使用items加入各控件元素来丰富我们的表单面板, defaults:{},此属性提取了items中各组件项

div css表单布局的五个小技巧

核心提示:div css表单布局的五个小技巧可以帮助你更灵活的控制表单,使页面更加满意. div css表单布局的五个小技巧可以帮助你更灵活的控制表单,使页面更加满意. 1.表单文本输入的移动选择: 在文本输入栏中,如果加入了提示,来访者往往要用鼠标选取后删除,再输入有用的信息.其实只要加入 代码到 <textarea> 中,一切就会变得简单多了,如: <textarea name=textarea wrap=virtual rows=2 cols=22 >Input Englis

php常用表单验证类用法实例

  本文实例讲述了php常用表单验证类用法.分享给大家供大家参考.具体如下: ? 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73

BootStrap 智能表单实战系列(五) 表单依赖插件处理_javascript技巧

什么是 Bootstrap? Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的. 历史 Bootstrap 是由 Twitter 的 Mark Otto 和 Jacob Thornton 开发的.Bootstrap 是 2011 年八月在 GitHub 上发布的开源产品. Bootstrap 包的内容 基本结构:Bootstrap 提供了一个带有网格系统.链接样式.背景的基本结构.这将在 Bootst

php常用表单验证类用法实例_php技巧

本文实例讲述了php常用表单验证类用法.分享给大家供大家参考.具体如下: <?php /** * 页面作用:常用表单验证类 * 作 者:欣然随风 * QQ:276624915 */ class class_post { //验证是否为指定长度的字母/数字组合 function fun_text1($num1,$num2,$str) { Return (preg_match("/^[a-zA-Z0-9]{".$num1.",".$num2."}$/&q

入口的用户体验:注册表单的5个设计技巧

网上挤满了各种各样的UI设计方案,事实上我们已经有一套套的方案可遵循.但!设计永无止境!哪怕是一个注册表单,也值得再细心研究.下面给出注册表单设计5个小技巧: 1.别让用户重复填写相同的内容 几乎每个人都经历过这样一个事实:注册时被要求填写邮箱地址两次或重复输入密码.但是这其实是没有必要的.仅填写一次,因为用户一般都记得自己常用的邮箱地址和密码.假设哪天用户忘记密码了可以通过邮箱找回,再多此一举填写两次反而更加容易导致用户流失. 下面是一些非常值得参照的表单设计: 2.突出必填字段 从用户体验的