如何将图标放在textarea中？

Question

我想把这个图标放在下图中我的文本区域内。

这是我的代码：

<div class="form-group" style="text-align: right;width: 100%;">
          <textarea row=100 cols=60
                    type="text"
                    id="input"
                    formControlName="txt"
                    placeholder="متن ...">
          </textarea>
          <span class="icon-user"></span>
        </div>

有人知道我该怎么做才能解决这个问题吗？

Answer 1

您可以像这样使用 css 来实现它。
.icon-user { position:relative; top: -10px; left: -100px; }
根据需要调整 top 和 left 的值。 :)
您可以通过其他方式将 position: absolute 添加到文本区域和图标。

Answer 2

示例如下：https://jsbin.com/laduyemewo/edit?html,css,output

这里的关键变化是将position: relative;设置为父<div class="form-group">并申请<span class="icon-user"></span> - position: absolute; bottom和left 属性基于您的尺寸。

如何将图标放在textarea中？

How put icon inside textarea?

html

css

textarea