对输入框的一些认识

定义

  在输入框中单击鼠标会出现插入点光标,我们可以直接在输入框中输入文字或文本信息。

形式

  出现的形式分三种,一种是空白的,需要用户输入的;一种是有默认的,也可以进行更改输入的;还有一种就是带提示的。

空白输入框
带提示的输入框
默认文本信息的输入框

状态

  分为填写状态和反馈状态,状态的表现有很多种,常用的举例如下:

输入框填写时边框变成蓝色输入框填写时底色由白色变为橙色
填写时输入框底色变成橙色
输入框填写时出现列表提示
输入框反馈时框变成红色,框外有红色提示字样

用途

  用于搜集用户信息。

类型

  输入框根据属性可以分为以下几种类型:

1文本框

  文本输入框又可以分为单行文本输入框和多行文本输入框。单行文本输入框有单行的文本域/密码域/手机和电子邮箱。单行文本输入框有长度限制,密码又有大小写和文字数字之分,而手机和电子邮箱有有效和无效之分。多行文本输入框有长度和高度两个限制,还有默认高度和最大高度以及超过最大高度出现垂直滚动条,还有在页面占位的实际高度。

单行的文本输入框
密码输入框
手机输入框
邮箱输入框
多行文本输入框

2.单选框

  多个单选框可以组成一组,在这一组当中,只能有一个被选中。

单选框1
单选框2

3.多选框

  多选框就是在一组当中可以有多个选择

多选框
QQ标签的多选框

4.下拉列表框

  下拉列表式的输入框一般是有很多个选项时才归列,最右侧会有提示展开的三角按钮,点击展开后会有垂直滚动条。一种是没有默认选择的,还有一种是有默认选择,用户也可以做更改的。也有循环滚动的列表,多在手机上使用。

下拉列表式输入框
下拉列表式输入框带默认选项
循环滚动列表输入框

  输入框在设计时时常还要考虑到很多交互上的细节,比如在手机号的填写时,为了便于用户识别要采用3-4-4的格式显示;在金额输入时要采用千位分隔符;移动端输入时如果是文字要弹出文字的输入法,如果是手机就要弹出数字的输入法等等。一切以用户有更愉快的体验为目标。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1、窗体 1、常用属性 (1)Name属性:用来获取或设置窗体的名称,在应用程序中可通过Name属性来引用窗体。 ...
    Moment__格调阅读 10,024评论 0 11
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,195评论 4 61
  • HTML标签解释大全 一、HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(D...
    米塔塔阅读 8,653评论 1 41
  • 以前夜里我们静静坐在海边 听见天空掉落白鸽 一只海鸥竖起了耳朵 是时候 拎干诗歌里的水 哟,七月雨水真大 你假装回...
    苏苏诺阅读 1,787评论 7 4
  • 第3次到郑州,今年的第二次来郑州。一下火车,被大雪过境的凄冷冻的直哆嗦,郑州火车站的广场还是那么的拥挤不堪,广场的...
    jiang天1阅读 3,287评论 0 0