我有一个简单的 html 登录页面,其中有两个文本框和图标。当我用自动完成数据填充文本框时,图标隐藏并且文本框颜色变为黄色。为什么会这样。请帮我 ?
代码如下:
<!DOCTYPE html>
<html>
<head>
<link href="css/main.css" rel="stylesheet"/>
</head>
<body style="background-color:#f5f5f5;font-family:Tahoma;"
<div class="login_div">
<div style="height:20px;width:240px;background-color:#00b300;"><span style="color:white;margin-left:10px">Secure Login</span></div>
<form id="frm" action="check_login.php" method="post">
<input class="in_box1" name="username" type="text" placeholder="Username/Email" title="Enter Username or Email" maxlength="20" required>
<input class="in_box2" name="password" type="password" placeholder="Password" title="Enter Password" maxlength="10" required>
<input style="margin-left:25px;font-size:15px;" type="checkbox" title="Enter Password">
<span style="font-size:14px;">Remember Me</span><br>
<input class="in_btn" type="submit" value="Login">
</form>
</div>
</body>
</html>
https://jsfiddle.net/8v21wmbf/1/ ..这是相同的 jsfiddle,但它没有任何图像。
最佳答案
我们应该使用 bootstrap 来解决这个问题。 检查一下:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<form id="frm" action="check_login.php" method="post">
<div class="input-group">
<span class="input-group-addon">(your icon)</span>
<input class="in_box1" name="username" type="text"
placeholder="Password" title="Enter Username or Email" maxlength="20"
required/>
</div>
<div class="input-group">
<span class="input-group-addon">(your icon)</span>
<input class="in_box2" name="password" type="password" placeholder="Password"
title="Enter
Password" maxlength="10" required/>
</div>
</form>
我希望这会有所帮助。 https://v4-alpha.getbootstrap.com/components/input-group/
JsFiddle 链接是: https://jsfiddle.net/6ugek6qw/
关于javascript - 为什么自动完成会删除文本框图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47751264/