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

作者:ruizh 时间:2020-07-26 22:10:51 

想必大家在页面都使用过表单,如果你对单调的表单控制单元不满意,不妨看看以下几条技巧:
1、表单文本输入的移动选择:在文本输入栏中,如果加入了提示,来访者往往要用鼠标选取后删除,再输入有用的信息。其实只要加入onMouseOver="this.focus()" onFocus="this.select()" 代码到 <textarea> 中,一切就会变得简单多了,如:

<textarea name=textarea wrap=virtual rows=2 cols=22 onMouseOver="this.focus()" onFocus="this.select()">Input English..</textarea>

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

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

点击输入单元后,提示信息会删除,是不是很方便。
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"为控制在弹出窗口打开。

标签:
0
投稿

猜你喜欢

  • SQL Server 总结复习 (二)

    2012-10-07 10:35:00
  • JavaScript经典效果集锦

    2013-08-13 09:29:34
  • PHP循环与分支知识点梳理

    2023-05-29 13:09:21
  • js+asp总结

    2009-11-16 17:49:00
  • IDEA 2020 设置项目集成git 及svn和git之间的切换问题

    2022-11-23 20:02:14
  • pytorch K折交叉验证过程说明及实现方式

    2021-01-11 16:05:08
  • ODBC连接数据库以SQLserver为例图文详解

    2024-01-13 04:07:43
  • 详解Python3定时器任务代码

    2023-10-15 14:50:26
  • asp get和post数据接收过滤

    2011-04-06 10:52:00
  • mysql5.7.23版本安装教程及配置方法

    2024-01-14 15:45:53
  • 去除DW MX 2004表格宽度辅助

    2010-09-02 12:37:00
  • PHP5中使用DOM控制XML实现代码

    2023-09-30 09:00:07
  • JavaScript ParseFloat()方法

    2024-04-29 13:35:48
  • python redis连接 有序集合去重的代码

    2023-10-23 21:24:32
  • 在Mac中PyCharm配置python Anaconda环境过程图解

    2023-10-19 01:22:53
  • python区块链持久化和命令行接口实现简版

    2023-10-28 09:43:08
  • JavaScript中函数表达式和函数声明及函数声明与函数表达式的不同

    2024-04-19 10:02:23
  • Python开发虚拟环境使用virtualenvwrapper的搭建步骤教程图解

    2022-02-08 00:33:29
  • openCV实现图像融合的示例代码

    2022-05-20 03:28:16
  • Python import导入上级目录文件的方法

    2022-11-16 01:27:41
  • asp之家 网络编程 m.aspxhome.com