Html 如何在引导模式标头上添加响应背景图像？

我必须添加一个背景图像到模式标题，它应该是响应以及。我能够添加图像，但在使其响应方面遇到了问题。谢谢你的帮助

下面是示例代码段

.modal头文件{
边框底部：无；
填充：15px 15px 0 15px；
背景图片：url(https://s9.postimg.org/ky3v3mduz/Jellyfish.jpg);
高度：208px；
背景尺寸：包含；
背景重复：无重复；
.结束{
背景：无；
边界：无；
浮动：对；
字体大小：40px；
线高：20px；
填充：0；
&：悬停{
颜色：@悬停脸红；
}
}
}
}

结合使用
背景尺寸：封面；背景位置：中心假设您希望图像的中心是始终显示的部分。否则，根据需要进行调整，以确保显示图像的焦点


.modal头文件{
边框底部：无；
填充：15px 15px 0 15px；
背景图片：url(https://s9.postimg.org/ky3v3mduz/Jellyfish.jpg);
高度：208px；
背景尺寸：封面；
背景重复：无重复；
背景位置：中心；
.结束{
背景：无；
边界：无；
浮动：对；
字体大小：40px；
线高：20px；
填充：0；
&：悬停{
颜色：@悬停脸红；
}
}
}
}

结合使用
背景尺寸：封面；背景位置：中心假设您希望图像的中心是始终显示的部分。否则，根据需要进行调整，以确保显示图像的焦点


.modal头文件{
边框底部：无；
填充：15px 15px 0 15px；
背景图片：url(https://s9.postimg.org/ky3v3mduz/Jellyfish.jpg);
高度：208px；
背景尺寸：封面；
背景重复：无重复；
背景位置：中心；
.结束{
背景：无；
边界：无；
浮动：对；
字体大小：40px；
线高：20px；
填充：0；
&：悬停{
颜色：@悬停脸红；
}
}
}
}

要有一个反应灵敏的背景图像，你需要的是一个百分比。要完全覆盖内容区域，您可以使用：

.modal-header {
  background-size: 100% 100%;
  background-repeat: no-repeat;
}


.modal头文件{
边框底部：无；
填充：15px 15px 0 15px；
背景图片：url(https://s9.postimg.org/ky3v3mduz/Jellyfish.jpg);
高度：208px；
背景大小：100%100%；
背景重复：无重复；
.结束{
背景：无；
边界：无；
浮动：对；
字体大小：40px；
线高：20px；
填充：0；
&：悬停{
颜色：@悬停脸红；
}
}
}
}

要有一个反应灵敏的背景图像，你需要的是一个百分比。要完全覆盖内容区域，您可以使用：

.modal-header {
  background-size: 100% 100%;
  background-repeat: no-repeat;
}


.modal头文件{
边框底部：无；
填充：15px 15px 0 15px；
背景图片：url(https://s9.postimg.org/ky3v3mduz/Jellyfish.jpg);
高度：208px；
背景大小：100%100%；
背景重复：无重复；
.结束{
背景：无；
边界：无；
浮动：对；
字体大小：40px；
线高：20px；
填充：0；
&：悬停{
颜色：@悬停脸红；
}
}
}
}

我认为你所需要的只是一张合适大小的图片，并改变背景大小以覆盖


.modal头文件{
边框底部：无；
填充：15px 15px 0 15px；
背景图片：url(http://www.bahai.org/chrome/img/beliefs/bahaullah-covenant-feature-img.jpg?3e7a0319);
高度：208px；
背景尺寸：封面；
背景重复：无重复；
.结束{
背景：无；
边界：无；
浮动：对；
字体大小：40px；
线高：20px；
填充：0；
&：悬停{
颜色：@悬停脸红；
}
}
}
}

我认为你所需要的只是一张合适大小的图片，并改变背景大小以覆盖


.modal头文件{
边框底部：无；
填充：15px 15px 0 15px；
背景图片：url(http://www.bahai.org/chrome/img/beliefs/bahaullah-covenant-feature-img.jpg?3e7a0319);
高度：208px；
背景尺寸：封面；
背景重复：无重复；
.结束{
背景：无；
边界：无；
浮动：对；
字体大小：40px；
线高：20px；
填充：0；
&：悬停{
颜色：@悬停脸红；
}
}
}
}

我认为这会扭曲图像是的，会的。请记住，您可以提供单个参数，并根据自己的喜好进行调整<代码>背景大小：100%
将保留图像比例，但部分图像将被切断（在y轴上）。这取决于您希望它如何“响应”。模态标题本身不能改变高度，因此如果您想要缩放的响应图像，最好使用
标记。我更新了答案，提供了一种可能更理想的替代方法。我认为这会扭曲图像是的，它会。请记住，您可以提供单个参数，并根据自己的喜好进行调整<代码>背景大小：100%
将保留图像比例，但部分图像将被切断（在y轴上）。这取决于您希望它如何“响应”。模态标题本身不能改变高度，因此如果您想要缩放的响应图像，最好使用
标记。我已经更新了答案，提供了一种可能更可取的替代方法。如果我们使用背景尺寸：封面，