占位符中的fontawesome用户

Question

如何将fontawesome放入占位符。这是我的代码：

<div class="form-group">         
    <input class="form-control" placeholder="username" id="inputdefault" type="text" />
    <input class="form-control" placeholder="password" id="inputdefault" type="text" />
</div>

Answer 1

尝试这种方式：

input {
  padding:10px;
	font-family: FontAwesome;
   
}

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet"/>
<form role="form">
  <div class="form-group">
    <input type="text" class="form-control empty" id="iconified" placeholder="&#xf2ba">
  </div>
</form>

Answer 2

你可以试试这个：

＆＃13;

＆＃13;

/* add the font to the input element*/

input {
  font: normal normal normal 14px/1 FontAwesome;
  font-size: inherit;
  text-rendering: auto;
}

＆＃13;

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- add the code of the icon in the placeholder-->
<input class="form-control" placeholder="&#xF002;" id="inputdefault" type="text">

＆＃13;

＆＃13;

＆＃13;

您可以找到代码here

Answer 3

<input type="text" class="form-control" placeholder="&#xF002;" id="inputdefault" style="font-family:Arial, FontAwesome" />

可以在Font Awesome cheatsheet中找到十六进制代码列表。