Question

我对此非常陌生，我一直在努力在预订表单的一个文本字段中放置一个字体真棒图标。虽然我已经看到了所有相关的问题和答案，但要么它们太具体，要么我不知道如何根据我的具体问题实施它们。所以这是我对特定领域的代码：

<div class="row">
  <div class="col-md-6">
    <input 
      type="text"  
      name="country"  
      id="country"  
      placeholder="<?php _e( 'country', 'ci_theme' ); ?>"  
      value="<?php echo esc_attr( $country ); ?>"  
      required>
   </div>

我在哪里/如何放置字体真棒图标＆＃34; fa fa-globe＆＃34;，因此它显示在字段的左下角。到目前为止，我能够将它显示在实际区域下方，这让我更加困惑！另外，我需要应用的CSS是什么，（现在不打扰颜色和尺寸，我知道如何解决这些问题）。

感谢您提供所有宝贵的帮助......

Answer 1

您可能更喜欢这样的内容：http://materializecss.com/forms.html 您可以使用

获得此效果

<div class="input-field col s6"> <i class="fa fa-globe"></i>
    <input id="icon_prefix" type="text" class="validate">
</div>

http://jsfiddle.net/v49pjhfj/

或者您可以使用：

<input placeholder="&#61612; Username"/>

用css

input { font-family: 'FontAwesome'; }

如果您想知道其他图标的占位符代码：在the site和convert it from hex to dec上查找unicode值

http://jsfiddle.net/v49pjhfj/1/

将字体放置在表单的文本字段中

1 个答案: