问题标签 [twitter-bootstrap-4]

我正在尝试创建一个水平的卡片列表，其中一次显示 3 张卡片，其他卡片可以水平滚动，如下所示：

这可以很容易地用 CSS 完成，但我想用 Bootstrap 来完成。Bootstrap 4 附带了随着材料设计而流行的卡片，它们与 Bootstrap 中的其他任何东西一样易于使用。对于这个例子，它也可以是常规div的，而不是卡片。

我正在努力解决的问题是创建一个可滚动的 X 卡片（或 div）容器，其中一次显示 3 个，其他的溢出到右侧并且是可滚动的。我不确定如何使用 Bootstrap 给卡片（或 div）一个宽度，以便一次显示 3 个，而其他的则位于右侧。

我在某处改变了一些东西，现在col-sm-offset-*根本不工作。例如，如果我想将屏幕分成两半，并且只在右侧显示内容，我通常会使用：

我怎样才能检查出什么问题？

我正在使用 NPM 和 Laravel Elixir (gulp) 来缩小（准备好生产）文件并且没有我在这里复制整个 CSS 文件，我不知道还能做什么。有什么明显的吗？有没有人遇到过这个？

更新

网络检查员

CSS 计算属性

更新 2

我已经在 GitHub 上提交了一个问题，因为这可能是故意的。

我在 bootstrap 4.0 alpha _variable.scss 文件中找到了一个变量：

如果我想引用这样的东西，我该如何引用这个变量：

这不起作用...有什么建议吗？

我正在尝试在 Bootstrap 4 中重新皮肤/重新格式化工具提示，而原来的做法似乎不再有效。目前我正在这样做：

.tooltip-inner工作正常，但.tooltip.top .tooltip-arrow不是；它保持黑色。我假设.tooltip.top是底部对齐工具提示顶部的箭头。

任何帮助将不胜感激

我正在使用Bootstrap 4 网格系统，并且想在屏幕的右侧漂浮一旁。

目前我的主要内容包含在col-xl-3中，我希望ASIDE也使用col-xl-3，但我希望它运行页面的高度，而不仅仅是它所在行的高度，如它目前正在将行的高度推出......

正如你从图片中看到的那样，我的旁边是把顶行推得比底行高......

我所做的所有代码都是这样的；

任何帮助将不胜感激。

我是早午餐的新手，但是在尝试使用 sass-brunch 和 bootstrap-4.0.0-alpha.2 作为 npm 安装的模块进行设置时，我无法让它包含 bootstrap.scss。关于我做错了什么的任何想法？

这是一个小示例项目。

我的 package.json：

我的早午餐-config.js：

的输出brunch build -d如下。sass-brunch已成功用于处理app/styles/main.scss- 有一条brunch:pipeline线显示它。然而，尽管顶部附近的几行似乎表明它已找到并编译引导程序bootstrap.scss，而brunch:generate底部附近的一行似乎表明它已连接到vendor.css，但该文件是空的，除了指向vendor.css.map( /*# sourceMappingURL=vendor.css.map*/) 的注释，并且地图只包含{"version":3,"sources":[],"names":[],"mappings":"","file":"public/vendor.css"}.

我试过的东西不起作用：

• plugins.sass.options.includePaths: ['node_modules/bootstrap/scss']向brunch-config.js添加设置；输出没有变化。

• 向 brunch-config.js添加一个paths.watched: ['app', 'test', 'vendor', 'node_modules/bootstrap/scss']设置——它现在似乎可以找到并查看该目录中的所有文件，但仍然没有通过 brunch 管道将 bootstrap.scss 发送到 sass-brunch 可以破解的地方。

这是输出：

我正在使用 Bootstrap 4 并在我的页面上使用水平项目进行导航。在小型设备上，此菜单折叠并且菜单项仍处于水平线中。我应该怎么做才能将其更改为垂直以便每行一个项目？

I am attempting to create a page that is populated by many cards, using bootstrap 4's new card component.

I want to create a search bar, that when searched, filters out cards whose titles don't match the search query.

Here is a plunker of what I have in mind. Plunker

I would like the cards to get something like a display: none, or opacity:0 if they don't match.

I currently am attempting to write a function that onChange of the search bar does this. I'll post if I can get it figured out.

I've tried to use the built in snippet feature as well.

我正在尝试在引导程序 4 中实现卡片组功能，以使我所有的卡片都具有相同的高度。

bootstrap 提供的示例显示了 4 张不错的卡片，但无论视口如何，它都是一行中的 4 张卡片。请参阅此处的代码。

这对我来说没有意义，因为我假设您希望卡片缩小到最小尺寸，以便您的内容仍然看起来不错。

然后我尝试添加一些视口类来打破屏幕尺寸，但是一旦添加了该 div，卡片组就不再适用，因此不会使卡片高度相等。

我怎样才能做到这一点？这是将在 Bootstrap 4 的完整版本中解决的缺失功能吗？

这是小提琴：https ://jsfiddle.net/crrm5q9m/

我正在开发一个使用 Bootstrap 4 Alpha 的应用程序。我正在尝试创建一些卡片。我正在尝试在此站点上重新创建看起来像课程卡的东西。但是，我正在尝试使用默认的引导样式。换句话说，我正在尝试创建一张如下所示的卡片：

我一直在尝试在这里重新创建它。日期与图标不在同一行。我的代码如下所示：

我究竟做错了什么？