Javascript 为什么'；我的图像不能在有角度的2/4 css上显示吗？

我正在为我的网站做一个英雄形象，但是这个形象没有出现。我不知道为什么

我的html

<div class="hero-image">
  <div class="hero-text">
    <h1 style="font-size:50px">I am John Doe</h1>
    <p>And I'm a Photographer</p>
    <button>Hire me</button>
  </div>
</div>

---

属性高度50%不起作用，除非第一个div标记中有文本。在div内创建图像标记

希望这有助于：

。英雄形象{
背景图像：url（“https://newsi.creativecow.com/i/879292/2.jpeg");
高度：500px；/*相应改变*/
背景位置：中心；
背景重复：无重复；
背景尺寸：封面；
位置：相对位置；
}
.英雄文本{
文本对齐：居中；
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
颜色：白色；
}

我是无名氏
我是一名摄影师

雇用我

好吧，我不太清楚你之后想做什么，但一个解决方案是将你的

div class英雄形象写为绝对位置，但在这种情况下，我想参考的是主体，我不知道你是否想要这个解决方案，另一个方法是写
宽度：100%

总结：

.hero-image {
 background-image: url("https://newsi.creativecow.com/i/879292/2.jpeg");
 height: 100%;
 width: 100%;
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 position: absolute;
} 

模板和css在哪里声明？样式是作为
样式内联的还是在
样式URL
下引用的？显示具有这些引用的组件。它位于styleurls下。请先显示使用，然后显示代码。如果我把它放到我自己的组件中，它就可以正常工作。这很奇怪。所以你刚刚确认了代码是有效的。嗯，我想知道有什么问题。文本显示了，但图像不清楚，因为我看不到你的代码，尽管我已经多次要求你在你的问题中发布代码。我想其他人也会得出同样的结论。你也可以在div中添加图像标签来显示图像。如果你喜欢的话。我必须把高度从百分比改成px谢谢你
.hero-image {
 background-image: url("https://newsi.creativecow.com/i/879292/2.jpeg");
 height: 100%;
 width: 100%;
 background-position: center;
 background-repeat: no-repeat;
 background-size: cover;
 position: absolute;
}