Как я могу установить выбор изображения профиля ввода на правой стороне ввода с меткой вместо «выбрать файл» -> «выбрать изображение»

Question

Я создаю форму учителя. Я хочу выбрать изображения из галереи для профиля, я хочу изменить метку и положение «кнопки выбора изображения» справа с меткой «Выбрать изображение» и метку в том же поле ввода слева. сторона "пожалуйста, выберите изображение профиля" я использую угловой и начальной загрузки 4

Это HTML

                  <div class="form-group ">
                    <p class="input-group">
                        <i class="fa fa-camera fa-2x  user-icon fa-fw" aria-hidden="true"></i>
                        <label for="file">Choose file to upload</label>
                        <input type="file" name="pic" accept="image/* "  class="form-control">
                     </p> 
                   </div>

Это Css.

.form-control{
    background: #000;
    color: beige;
}

Answer 1

  <div class="form-group ">
    <p class="input-group">
        <i class="fa fa-camera fa-2x  user-icon fa-fw" aria-hidden="true"></i>
        <label for="file" class="col-sm-10 form-control">Choose file to upload</label>
        <input type="file" name="pic" accept="image/* "  class="col-sm-2 form-control">
     </p> 
   </div>

Пожалуйста, попробуйте этот способ. Надеюсь, это поможет вам .. :)