①:如何修改placeholder样式?

    

    input::-webkit-input-placeholder {
    color: #ccc;
    font-size: 15px;
    }

    注:其它浏览器适配方案

              

    原文参考:https://webfem.com/post/placeholder

  ②:设置获取焦点后输入文字大小的样式

    

    input:focus {
    font-size: 15px;
    {

    设置获取到焦点时边框的样式

    

    input:focus {
    border: 1px solid red;
    }

    设置获取到焦点后 input 背景颜色

    

  ③:给 input 焦点设置颜色,只需给 input 设置 color 属性即可(这样焦点和输入的文字都是一个颜色)

     

  

  ④:input autofocus 属性,自动获取焦点

      http://www.runoob.com/tags/att-input-autofocus.html

     

    注:PC—IE9及以下不支持;移动端—ios safari都不支持,安卓3及以上都支持

 

  ⑤:autocomplete属性让浏览器自动记录之前输入的值 

    

    注:autocomplete="on" 启用自动记录;autocomplete="off" 禁用自动记录

input使用小技巧的更多相关文章

  1. input的小技巧 清除自动记录

    input 消除自动记忆功能 在html里就可以直接清除了<input type="text" autocomplete="off"> input ...

  2. [转载]Js小技巧||给input type=“password”的输入框赋默认值

    http://www.cnblogs.com/Raywang80s/archive/2012/12/06/2804459.html [转载]Js小技巧||给input type="passw ...

  3. 在Android中使用am和input命令在实际使用中的注意事项以及小技巧

    在Android使用到am和进行一些操作是非常方便的,比如一个重复自动的操作,具体用来实现一些什么是看个人需求了,接下来说对于am和input的使用. 本文适用于已经大概去了解了am和input的朋友 ...

  4. 纯html+css中实现静态选座位效果技巧(input+label使用小技巧)

    很多时候,我们想通过html+css的方式实现排列在后方的代码在选中状态下,能控制排列在前的代码的样式.那么要怎么实现呢?在这里我就要用1个小技巧来完成. 众所周知的,我们css中的选择器通常只能向下 ...

  5. css的一些小技巧。修改input样式

    在第一次正式写项目的时候,遇到了几个布局的小技巧.记录一下. 我们常常会遇到图片和文字对齐的一种样式.比如 这样的样式,我们写的时候有时候会出现不对齐的情况.我们有俩种方法 一种就是flex的布局,还 ...

  6. 【每日一个小技巧】Python | input的提示信息换行输出,提示信息用变量表示

    [每日一个小技巧]Python | input的提示信息换行输出,提示信息用变量表示 在书写代码的途中,经常会实现这样功能: 请输入下列选项前的序号: 1.选择1 2.选择2 3.选择3 在pytho ...

  7. JS处理事件小技巧

    今天,就分享一下我自己总结的一些JS的小技巧: ①防止鼠标选中事件 <div class="mask" onselectstart="return false&qu ...

  8. STM32之ADC+步骤小技巧(英文)

    神通广大的各位互联网的网友们.大家早上中午晚上好好好.今早起来很准时的收到了两条10086的扣月租的信息.心痛不已.怀着这心情.又开始了STM32的研究.早上做了计算机控制的PID实验,又让我想起了飞 ...

  9. 你想的到想不到的 javascript 应用小技巧方法

    javascript 在前端应用体验小技巧继续积累. 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放 event.srcElemen ...

随机推荐

  1. JIRA API 对接

    系统要跟JIRA对接,将本系统数据发送给jira. 开始一头雾水怎么让数据传过去已什么形式存在,是存数据库呢还是怎么显示呢.研究半天发现其实只要将原数据作为json数据提供给jira接口,jira接口 ...

  2. java实现定时任务的三种实现方法

    转载于:https://blog.csdn.net/haorengoodman/article/details/23281343/ /** * 普通thread * 这是最常见的,创建一个thread ...

  3. 烽火2640路由器命令行手册-13-VPDN(L2TP,PPTP,PPPOE)配置命令

    VPDN(L2TP,PPTP,PPPOE)配置命令 目  录 第1章 VPDN配置命令... 1 1.1 VPDN配置命令... 1 1.1.1 accept-dialin. 1 1.1.2 doma ...

  4. Finally! I do understand "flex-basis"

    Long, long, long ago,CSS3就支持了flex布局,现在各家浏览器都支持标准的语法了,这里推荐一篇比较全面的图文化教程A Complete Guide to Flexbox. 关于 ...

  5. Docker使用docker-compose.yml构建Asp.Net Core和Mysql镜像并与Mysql数据库通信

    version: '3' services: mycore01: build: context: .   container_name: 'mycore01'   #自定义容器名 dockerfile ...

  6. MyCat全局表和ER--笔记(三)

    全局表 全局表的作用 在分片的情况下,当业务表因为规模而进行分片以后,业务表与这些附属的字典表之间的关联,就成了比较棘手的问题,考虑到字典表具有以下几个特性: 变动不频繁 数据量总体变化不大 数据规模 ...

  7. git的基本使用方式

    git!git!git!这是一个版本控制工具,本地仓库的话就是一个离线的版本控制工具,为了解决文件回滚和多副本的问题出来的,远程仓库的云端叫github. 这是目前最先进的分布式版本控制系统,下面记录 ...

  8. Love Live!-01字典树启发式合并

    链接:https://ac.nowcoder.com/acm/contest/201/D?&headNav=www 思路:题目要求的是每个等级下的最大 简单路径中的最大异或值,那么我们为了保证 ...

  9. Hibernate: '\xE6\x9D\x8E\xE5\x9B\x9B' for column 'cust_name' at row 1 解决

    新建Hibernate,出现异常 20:11:03,117 WARN SqlExceptionHelper:137 - SQL Error: 1366, SQLState: HY000 20:11:0 ...

  10. (转)CentOS7中防火墙的基本操作

    目录 1.firewalld简介 2.安装firewalld 3.运行.停止.禁用firewalld 4.配置firewalld 5 打开端口 学习apache安装的时候需要打开80端口,由于cent ...