在 angularJS 中將文本區域或文本重疊在圖像 HTML、CSS 上

Question

我正在為研究創建一個網站。

當我創建文本區域和一些表單工作時，

我不知道如何重疊圖像和文本。

這是我想在下面做的一個例子這是截圖的例子

如何像上傳的圖像一樣在圖像上重疊文本區域或文本？

謝謝！

<div class = "container">
   <img src = '/assets/img/Iphone.png' alt="Snow" width = "300" height = "530" style = "margin-top: -1300px; margin-left:-200px">
   <div class="centered" style = "margin-top: -800px; margin-left: -10px; padding: 10px;" src = '/assets/img/Iphone.png'>hello</div>
</div>  

這是第二個例子

我想為“你好”制作背景顏色作為第二個例子。

Answer 1

將元素放在父元素的右下角

 .wrapper { position: relative; width: 100%; height: 200px; } .wrapper textarea { width: 100%; height: 100%; } .wrapper .counter { position: absolute; bottom: 0; right: 0; }

 <div class="wrapper"> <textarea></textarea> <div class="counter">Foo</div> </div>