我正在处理正常的登录页面。我想在用户名和密码文本框周围添加不同的图标。我在下面添加了一张图片。我正在使用 Angular 4 开发核心 UI 模板。
我无法获得正确的序列。
<div class="app flex-row align-items-center">
<div class="container">
<div class="row justify-content-center">
<div class="col-lg-8">
<div class="card-group mb-0">
<div class="card p-4">
<div class="card-block">
<h1>Login</h1>
<p class="text-muted">Sign In to your account</p>
<form (submit)="loginUser($event)">
<div class="input-group mb-3">
<span class="input-group-addon"><i class="icon-user"></i></span>
<input type="text" class="form-control" placeholder="Username">
</div>
<div class="input-group mb-4">
<span class="input-group-addon"><i class="icon-lock"></i></span>
<input type="password" class="form-control" placeholder="Password">
</div>
<div class="row">
<div class="col-lg-6">
<button type="submit" class="btn btn-primary px-4">Login</button>
</div>
<div class="col-lg-6 text-right">
<button type="button" class="btn btn-link px-0">Forgot password?</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
最佳答案
如果您只想更改图标,请在此处选择您的图标:
http://fontawesome.io/3.2.1/icons/
只需更改类即可
<span class="input-group-addon"> <i class="icon-user"> </i></span> //Here
<span class="input-group-addon"> <i class="icon-lock"> </i></span> // andHere
关于javascript - 如何在登录模板周围添加不同的图标?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47868887/