问题标签 [bootstrap-cards]

我正在使用 Bootstrap 4.3.1 并尝试使用卡片创建视图。我遇到的问题是卡片在 chrome 和其他浏览器中显示得非常好，而在 Internet Explorer 11 中显示不正确

您可以在图像中看到我在 chrome 中获得正确的输出，而在 IE 中它被挤出。

IE 11 输出

我正在使用 Boostrap 构建一个网站，其目的是显示项目列表。每个项目都是一张卡片，并具有图像属性。问题是不同项目的图像可能有非常不同的大小。这导致一些卡片有很多空白空间，因为与其他图像相比，图像很小。我想要的是具有标准的图像大小，因此所有图像都会自动调整大小以具有相同的大小。这是我的代码：

我查看了类似的主题并尝试像这样修改 css：

但它什么也没改变。我将不胜感激一些帮助。

提前致谢 ！

我正在一个网站上工作，我有多个代表产品的卡片。我想在每张卡片的顶部都有标签，以便用户可以看到更多详细信息；但是，当我尝试这样做时，无论我单击哪张卡上的选项卡，只有第一张卡会发生变化。我认为这是因为由于循环，每个 id 和 aria-controls 都是相同的，但我不知道如何解决这个问题。请帮忙。

更新：

我使用引导程序创建了一张卡片。在该卡中，我打算插入一个包含数据的表格。

我的问题是在缩小屏幕时（检查响应性），表中的数据从卡中出来。

我该如何解决我的这个问题，有人可以帮助我吗？

谢谢

演示

.HTML

。CS

问题

我有一张带有页眉、页脚和这两者之间的列表的引导卡。我想让页眉和页脚固定，中间部分调整到窗口（正文）的高度，这样如果内容大于页面正文，中间部分可以有滚动条。我只能在“ul”元素中使用固定高度来执行此操作，但我希望它覆盖身体的高度。

我很难弄清楚为什么我不能在下面的 html 片段中显示图像，但只能显示在顶部。我已经搞砸了 z-index、!important 覆盖和其他几个小时，但无济于事。我怀疑这可能与引导程序处理卡片的方式有关。

理想情况下，我想在堆栈的“底部”放置一个纯色背景，然后是背景图像，然后是实际的叠加层。如果我可以将它们分成 div 会非常方便，但我不确定这是否与引导卡兼容。在这一点上，只要背景图像不在顶部，我就会采取任何措施。

请参阅底部的图像以获取输出。

• 实际行为：（从下到上）（纯色背景-->内容-->背景图片）
• 期望的行为：（从下到上）（纯色背景-->背景图像-->内容）

对于上下文，我有烧瓶运行一个使用此代码作为片段的模板。该片段被“调用”三次以生成图像中显示的网格。据我了解，这应该是确定问题所在所需要的全部内容。如果没有，我会很乐意编辑它以包含更多内容。

片段输出

在此处输入图像描述 我将 Bootstrap、Jquery 与 Angular 9 集成在一起。我使用了 jquery 数据表、Angular Mydatepicker、Angular Select 和 Bootstrap Card。卡片与选择下拉列表和日期选择器选择器重叠。我使用了 Bootstrap 4 和 Angular 9。这是 css 还是 Angular 的问题？我没有向我的组件添加任何自定义 css 类。

我有一个Bootstrap-card，但它的width. 我想那张卡片会占用我设置的列。这是我使用的一段代码和屏幕截图，它显示了实际宽度和想要的宽度（蓝色背景）。

你知道有什么好的解决方案来固定我的目标吗？请考虑响应式视图。

我正在使用 ReactJs-bootstrap，并且我有一张卡片，里面有图像。

在卡片里面有<Card.Img>我从 ReactJs-bootstrap 导入的标签。

那里有Card.Img属性'src'。当我尝试更改'src'它时，它会损坏图片，就好像它path是错误的一样。

我试图寻找答案，但我找不到任何与 React-bootstrap 有此问题的问题

{ * 图片的相对路径是'MainAppDict/src/images/rfm.jpg }

我的卡片组件：

}

我使用引导程序创建了以下卡片布局（如屏幕截图所示）。班级正在垂直添加我的.card-columns卡片，因此我丢失了卡片的一部分。

我希望我的卡片水平对齐，每行正好 3 张卡片，而不改变卡片的大小。

这是我的标记和代码：