html - 如何使用 Bootstrap 3 制作 3 张卡片的响应式轮播

标签 html css twitter-bootstrap-3

Here is the Sample image

如图所示,如何在每个页面中创建带轮播的卡片,它将显示为 3,在移动模式下,它将显示为一张卡片 如何使用 Bootstrap 或不使用 Bootstrap 进行任何建议?

最佳答案

尝试在 boostrap 中使用网格并按列划分卡片。例如,如果您有 12 个网格,您将对大型桌面使用 col-lg-4,然后对小型设备使用 col-xs-12

example

尝试最小化屏幕并查看响应情况

关于html - 如何使用 Bootstrap 3 制作 3 张卡片的响应式轮播,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45585721/

相关文章:

html - Bootstrap 3 : Issue with blockquote

css - 如何根据屏幕尺寸对列进行排序?

javascript - AngularJS 和 Jquery 的混合

c# - 当鼠标悬停在图像上时显示带有 linkbutton 的 div

html - Angular - 如何使用 [ngstyle] 将对象动态传递给 div 元素

css - 如何在 vue.js 中做作用域外部 css?

javascript - 动态更新包含 CSS 样式的 JS 变量

css - 推特 Bootstrap 模式出现在菜单顶部(可点击链接)

javascript - Angularjs 没有为 Bootstrap Popover 插入标题

html - 使用 Mojo::DOM 选择 CSS