zoukankan      html  css  js  c++  java
  • 关闭chrome浏览器的input香蕉黄背景

    chrome浏览器input的自动完成,点击之后自动输入,input的背景会变成香蕉黄,用如下方法修复:

    /* Change the white to any color ;) 
    就是给input设置内置阴影!而且一定要大,至少要比你的input本身大,不过,box-shadow是很慢的,
    而且,如果你的input是用图片做背景的话,是没有办法做这么干的*/
    input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 100px white inset;
    }
    /* Additionally, you can use this to change the text color: */
    -webkit-text-fill-color: yellow !important;

    或者

    /* Change Autocomplete styles in Chrome*/
    input:-webkit-autofill,
    input:-webkit-autofill:hover, 
    input:-webkit-autofill:focus
    input:-webkit-autofill, 
    textarea:-webkit-autofill,
    textarea:-webkit-autofill:hover
    textarea:-webkit-autofill:focus,
    select:-webkit-autofill,
    select:-webkit-autofill:hover,
    select:-webkit-autofill:focus {
        border: 1px solid green;
        -webkit-text-fill-color: green;
        -webkit-box-shadow: 0 0 0px 1000px #000 inset;
        transition: background-color 5000s ease-in-out 0s;
    }

    或者直接关闭chrome的自动完成

    <input type="text" autocomplete="off">

    <form autocomplete="off"></form>

    参考:https://stackoverflow.com/questions/2781549/removing-input-background-colour-for-chrome-autocomplete
               https://css-tricks.com/snippets/css/change-autocomplete-styles-webkit-browsers/

  • 相关阅读:
    LeetCode_326. Power of Three
    LeetCode_303. Range Sum Query
    LeetCode_299. Bulls and Cows
    LeetCode_292. Nim Game
    LeetCode_290. Word Pattern
    LeetCode_283. Move Zeroes
    LeetCode_278. First Bad Version
    LeetCode_268. Missing Number
    LeetCode_263. Ugly Number
    LeetCode_258. Add Digits
  • 原文地址:https://www.cnblogs.com/mengff/p/7459970.html
Copyright © 2011-2022 走看看