0
我已经建立了使用react-bootstrap与背景图像替换图像标签在反应的自举
我有部件内部的图像标签我的应用程序。它看起来像这样：
render() {
return (
<div id="homePage">
<div class="hero">
<Image src="/images/welcome-page-pic.jpg" responsive />
</div>
</div>
);
是的，这个框架中图像的标签是“图像”而不是“img”。
这将显示图像，但它不是非常敏感，所以我做了一些开发工具打转转，发现使用下面的造型工作，如果我使用的图像在CSS背景图像的造型：
.hero {
background-image: url(/images/welcome-page-pic.jpg);
height: 400px;
background-size: cover;
background-position: center right;
}
这当然需要删除标记和src，但这样做只是删除图像。如果我尝试将样式添加到HTML（或者更确切地说是JSX）而不是CSS，那么该页面根本就不加载。我也试过离开图像和src，只是添加css减去背景图像样式 - 也是不行。不知道这是一个框架问题还是一些愚蠢的行为。谢谢。
更新：玩了一会儿后，我发现无论出于何种原因，我的本地主机并不接受嵌套div中的类“英雄”。如果我手动将它添加到devtools中，图像就会出现并响应我的需求。现在的问题是为什么在jsx的页面加载时，类没有分配给div。