hi,欢迎访问本站!
当前位置: 首页Web前端正文

css去掉safari浏览器(苹果浏览器)密码输入框自带的小钥匙图标

墨初 Web前端 483阅读

在mac的苹果浏览器中,如果在密码的输入框中输入密码时会显示一个小钥匙的图标,点击可以提示保存密码。但如果有些密码的输入框中如果有别的图标提示,会造成样式出现混乱,如何解决这个问题呢?下面73so博客就详细的说一说。

CSS去除密码输入框小钥匙图标的方法

关于密码输入框小钥匙图标的显示

css去掉safari浏览器(苹果浏览器)密码输入框自带的小钥匙图标

解决方法:

<style>
input[type="password"]::-webkit-credentials-auto-fill-button {
    display: none !important;
    visibility: hidden;
    pointer-events: none;
    position: absolute; /* 避免占用 input 元素额外的 padding,正常情况下存在 display: none!; 就可以了 */
    right: 0;
}
</style>
<input type="password" name="" id="">

以上就是利用CSS样式代码去除苹果浏览器中密码输入框自带的小钥匙图标的方法,方法很简单只需要上面的CSS代码即可。

标签:
声明:无特别说明,转载请标明本文来源!
相关推荐