如何在文本上添加文本

Question

有没有办法在 CSS 或 JS 中将文本放在上面的文本上？

Answer 1

使用父元素relative position并将文本添加为absolute子元素：.elements {&nbsp; position: relative;}.outer-element, .inner-element {&nbsp; font-size: 60px;&nbsp; font-family: verdana;&nbsp; font-weight: bold;}.outer-element {&nbsp; color: blue;}.inner-element {&nbsp; position: absolute;&nbsp; left: 50px;&nbsp; top: 35px;&nbsp; color: yellow;}<div class="elements">&nbsp; <div class="outer-element">GTA</div>&nbsp; <div class="inner-element">ROLEPLAY</div></div>代码小提琴

Answer 2

是的，您可以使用 CSS 在图像前面添加文本。.container {      position: relative;      text-align: center;      color: white;    }    .firstline {      position: absolute;      top: 8px;      left: 15px;      font-size: 50px;      font-weight: bold;      color: white;    }    .secondtline {      position: absolute;      top: 22px;      left: 40px;      font-size: 70px;      font-weight: bold;      color: orange;    }<div class="container">      <img src="https://www.w3schools.com/howto/img_snow_wide.jpg" alt="Snow" style="width:100%;">      <div class="firstline">GTA</div>      <div class="secondtline">ROLEPLAY</div>    </div>

Answer 3

尝试这个<div style="position:absolute; top:0;left:0;">some text</div><div style="position:absolute; top:5;left:5;">some text</div><div style="position:absolute; top:10;left:10;">some text</div><br/><div style="position:absolute; top:110;left:100;">some text</div><div style="position:absolute; top:105;left:105;">some text</div><div style="position:absolute; top:100;left:110;">some text</div>