zoukankan      html  css  js  c++  java
  • 去除input默认带的上下按钮与修改placeholder的默认颜色、背景、placeholder内容的大小

    有时候需要用input元素中type属性值为number时,会出现默认的上下按钮,

    去掉input默认的上下按钮:兼容性写法如下

    input[type='number']::-webkit-outer-spin-button,
    input[type='number']::-webkit-inner-spin-button{
    -webkit-appearance:none !important;
    }

    //兼容火狐浏览器
    input[type='number']{
    -moz-appearance:textfield;
    }

    去掉前:

    去掉后:

    获取input的焦点:

    获取input的焦点通过:

    $(‘input[type="number"]’).focus();

    进入页面光标闪动


    修改placeholder内容的字体颜色、大小、背景:

    input::-webkit-input-placeholder { /* WebKit browsers */ 
    font-size: 20px;
    color: red; 
    
    } 
    
    input:-moz-placeholder { /* Mozilla Firefox 4 to 18 */ 
    font-size: 20px;
    color: red; 
    
    } 
    
    input::-moz-placeholder { /* Mozilla Firefox 19+ */ 
    /* placeholder大小  */
    font-size: 20px;
    /* placeholder颜色  */
    color: red; } 
    input:-ms-input-placeholder { /* Internet Explorer 10+ */ font-size: 20px; color: red; }

      

  • 相关阅读:
    Java学习之--List和ArrayList
    Linux
    Linux
    Docker 容器管理
    Docker 镜像管理
    如何理解 AWS VPC
    Linux 内核版本
    Windows 快速切换到当前目录下的dos环境
    Git 整理
    TCP/IP
  • 原文地址:https://www.cnblogs.com/lvxisha/p/9919591.html
Copyright © 2011-2022 走看看