如何用文本区域中相同的动作替换输入类型文件的图像(图标)？

Question

我是网页设计方面的新手。我想为我的网站建立一个评论系统，我对文本区域有一些问题。如何用文本区域中相同的操作替换图像(图标)而不是输入类型文件？

如何实现相同的功能？

 <div class="upload">
    <div class="image-upload">

   <textarea name="" id="txt" cols="20" rows="5"></textarea>
  <label for="file-input">
     <img src="">
   </label>

  <input id="file-input" type="file"/>
 </div>
 </div >

CSS

.upload{
display:inline-block;
position:relative;
}
input{
position:absolute;
bottom:10px;
right:2px;
}
textarea{
display:block;
width:500px;
}
.image-upload > input
{
display: none;
}
.image-upload img
{
width: 40px;
cursor: pointer;
}

我试过很多次了，但没有起作用。

Answer 1

若要在文本区域中添加图标，请在<img>之后插入图标的<textarea>标记，然后将以下内容添加到<textarea>中：

.icon-class {
    position: absolute;
    top: 0;
    left: 0;
}