html - 如何在文本区域中用相同的操作替换图像(图标)而不是输入类型文件？

Question

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

我该如何实现？

HTML

 <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> 之后的图标标签，然后将以下内容添加到 CSS:

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