在成功禁用自动填充的黄色背景颜色后,我偶然发现了另一个功能.
我的每个输入元素都有一个背景图像,每当我专注于文本输入时,浏览器会在下拉列表中建议我之前使用的值.
选择一个值后,自动填充功能会覆盖整个背景并隐藏图像.
这是我的html和css(在JSfiddle中详细说明):
<section class="formContainer">
<img class="sesameLogo" src="~/Content/Images/Site/sesamelogo.png" />
<form id="signUpForm" class="pageForm">
<input type="text" name="decoy" class="decoy"/>
<input type="password" name="decoy" class="decoy" />
<input type="text" placeholder="Full Name" name="FullName" id="fullName" />
<input type="text" placeholder="Email" name="email" id="email" />
<input type="password" placeholder="Password" name="password" id="password" />
<input type="password" placeholder="Confirm Password" name="confirmPassword" id="secPassword" />
<section id="actionBtnsCont">
<button id="btnSignUp" class="mainBtn" type="button">Sign Up</button>
<label class="genContextLbl">or</label>
<button id="btnSignIn" class="genBtn" type="button">Sign In</button>
</section>
</form>
</section>
Run Code Online (Sandbox Code Playgroud)