Question

我正在尝试为我的抽搐做这个，我有一个图像1600x400或类似的东西，这是我的警报的背景，所以如果昵称的长度改变，背景宽度相对变化，但我正在尝试要做的是如果文本长度改变则水平切割图像 something like this

Answer 1

在不了解代码细节的情况下，我可以提供：

您可以尝试设置css：

arp -a

JS小提琴：https://jsfiddle.net/1k4aqz13/

请回复更详细的信息，以便我们更好地回答您的问题。

Answer 2

您可以通过将background-image设置为图像以及background-repeat:no-repeat;来实现此目的，最重要的是将显示设置为内联表或内联块，以便元素包围其内部内容。

以下是示例代码。

#container{
  width: 100%;
}

.textContainer{
  background-image:url('http://placehold.it/350x100');
  height: 100px;
  background-repeat:no-repeat;
  display: inline-block;
  line-height: 30px;
  padding: 0 5px;
  /*Uncomment below if you want the image to stretch only when text in div goes beyond the image width-wise.*/
  /*background-size:cover;*/ 

}

<div id="container">
  <div class="textContainer">
    This is some test text here.
  </div>
  <br><br>
  <div class="textContainer">
    This is some test text here too to check.
  </div>
</div>

希望这有帮助。

使图像相对于文本长度

2 个答案: