为什么我不能在 Angular 13 中设置背景图像？

【问题标题】：Why I cannot set background image in Angular 13?为什么我不能在 Angular 13 中设置背景图像？
【发布时间】：2022-11-11 21:28:47
【问题描述】：

在另一个stackoverflow答案之后，我尝试了以下操作：

<div [style.background-image]="'url(https://picsum.photos/200)'"></div>

这确实没有效果，也没有显示图片。如果我改用<img> 标签并设置相同的url，它就可以工作。但我需要它作为 div 背景。

谁能告诉我我做错了什么以及如何正确设置 div 的图像背景？

【问题讨论】：

【解决方案1】：

问题在于您的 div 定义。 div 元素内部没有任何内容，因此他的高度/宽度为 0。尝试类似：

你的.component.html：

<div class="image"></div>

你的.component.css：

.image {
  height: 200px;
  width: 200px;
  background-image: url('https://picsum.photos/200');
}

【讨论】：