如何删除输入(safari)电子邮件和密码保存的意见框?

How to remove in input (safari) email and password saved suggestion box?

提问人:elvischepin 提问时间:8/8/2023 最后编辑:elvischepin 更新时间:11/17/2023 访问量:28

问:

SAFARI 建议钥匙盒

输入右侧有一个烦人的框,键在输入的右侧,无法在 safari 上删除它。请帮忙。 您可以查看图像并了解重点。

        <div>
          <label for="email">email:</label>
          <input
            name="email"
            id="user-email"
            autofocus
            required
            type="email"
            autocomplete="new-email" />
        </div>
        <div>
          <label for="password">password:</label>
          <input
            name="password"
            id="user-password"
            required
            minlength="8"
            type="password"
            autocomplete="off" />
        </div>

尝试过 autocomplete=“new-email” ;autocomplete=“off”,但它处理的事情与我想要的不同。

html 电子邮件 输入 safari 密码

评论


答:

0赞 Daniel 11/17/2023 #1

我认为您想要的是覆盖 shadow dom 中定义的样式

例如:

input::-webkit-credentials-auto-fill-button {
background-image: url("data:image/svg+xml,%3Csvg xmlns%3D\"http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg\" …2.467 2.521c.171.171.36.256.565.256z\" opacity%3D\".75\"%2F%3E%3C%2Fsvg%3E");
width: 24px;
height: 24px;
margin-left: 2px;
margin-right: 1px;
mix-blend-mode: luminosity;
flex-grow: 0;
flex-shrink: 0;
flex-basis: auto;
-webkit-user-select: none;
}

更多信息请点击此处。

覆盖 shadow-root 元素中的样式

此外,在我的情况下,根据焦点应用内联样式,例如

display: block !important;

display: none !important;

如果您只是想隐藏它,它使用的事实使得覆盖它有点棘手。!important

我的感觉是 safari 会根据上下文添加这些值,即如果文本输入在同一字段集中附加密码,它会假定它是用户名,并添加图标以允许您填充钥匙链或类似内容。