①:如何修改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. 论文阅读笔记四十八:Bounding Box Regression with Uncertainty for Accurate Object Detection(CVPR2019)

    论文原址:https://arxiv.org/pdf/1809.08545.pdf github:https://github.com/yihui-he/KL-Loss 摘要 大规模的目标检测数据集在 ...

  2. Python3——坦克大战

    # coding=utf-8 # Version:python3.6.1 __date__ = '2018/9/20 18:51' __author__ = 'Lgsp_Harold' import ...

  3. [转] 以 async/await 为例,说明 babel 插件怎么搭

    你一定碰到过这些库 babel-polyfill 项目地址:https://github.com/babel/babel/blob/master/packages/babel-polyfill 通过两 ...

  4. postgresql 53300错误

    1.查看当前库的最大连接数 show max_connections; 2.查看当前数据库的活动连接数 select datname,application_name,pid,state from p ...

  5. linux安装postgresql简洁版

    环境: linux 7.+ postgresql 10.5 1.下载10.5版本的源码,make后成可执行版本 2.创建数据库   initdb -D   /xxx/yyy(对应为数据目录,提前创建好 ...

  6. docker配置nginx做反向代理管理tomcat应用

    由于业务开始复杂,单一tomcat已经不足以满足业务需求,多tomcat部署起来不方便而且面临域名解析问题,因此开始增加反向代理,由于docker的易用性,便使用docker管理各个应用. docke ...

  7. 区块链基础认识-BTC

    1.什么是区块链 a.定义: 从本质上来说区块链就是一种通过将用户的某种特定信息(比如交易信息),通过很多台计算机记录保存并同步的过程,每个区块都记录了对应的交易信息,将这些交易信息串联起来就形成了所 ...

  8. Set接口下的集合

    一.集合(定义字段的时候统一使用包装类) 1.集合大类分为List.Set.Map三种,其中,List集合是有序可重复的,并且可以使用普通for循环.增强for循环.正向迭代器.双向迭代器:Set集合 ...

  9. vue获取当前对象

    <li v-for="img in willLoadImg" @click="selectImg($event)"> <img class=& ...

  10. SpringBoot使用Graylog日志收集

    本文介绍SpringBoot如何使用Graylog日志收集. 1.Graylog介绍 Graylog是一个生产级别的日志收集系统,集成Mongo和Elasticsearch进行日志收集.其中Mongo ...