Javascript html和css，使标题图像在调整大小/缩放时保持相同大小

我希望有人能帮助我。 我正在尝试创建一个带有大标题图像的网站，无论你放大或缩小多少，它的大小都是一样的。我想要的一个例子是这个网站：

我更希望在不使用任何javascript/jquery的情况下获得这种效果。当然，如果需要，我可以实现一个javascript/jquery解决方案

这是我的文档的HTML结构：

家
一些内容

使用与横幅大小比例相似的图像，图像将不会被切割太多。在您提供的示例中，有一个脚本可以调整横幅的高度。为此，您应该使用纯css解决方案

#headerImage {
  background-size: cover;
  background-position: center center;
  background-image: url(imageUrl);
  min-height: 300px;
} 

注意。CSS类在样式方面比id类更好

---

标题使用背景图像。如果你让它空着，就给它一个最小高度。我确实这么做了，但它并没有给出我想要的。它将在调整大小时剪切图像。正如您在示例中看到的，图像在调整大小时始终保持相同的大小，它不会被切断。这并不能完全回答问题，因为当我调整窗口大小时，图像会自动调整大小。我希望它保持与示例中相同的大小