Bootstrap List group in Foundation 5

Question

我正试图弄清楚如何使用Foundation5获得Bootstrap的列表组的等价物，包括列表组项目边界和所有内容。

然而，似乎没有任何相似之处。

我唯一发现的是ul/li在基金会网站上的建议。http://foundation.zurb.com/docs/components/typography.html

有什么想法吗？

更新：我想在Foundation中使用此列表组列出评论/评论。这里是使用Bootstrap。

<div class='list-group-item'>
  <div class='list-group-item-text'>
    <h4 class='list-group-item-heading'>
      <%= comment.user.email %>
      <%= time_ago_in_words comment.created_at %> ago
    </h4>
    <%= simple_format comment.body %>
    <div class='list-group'>
      <%= render comment.comments %>
    </div>
  </div>
</div>

Answer 1

基本上，我没有发现任何原因可以解释为什么你不能在你的Foundation CSS中编译Bootstrap的列表组CSS。

例如，在项目目录中运行bower install bootstrap-sass，然后在app.scss:中使用以下代码

@import "settings";
@import "foundation";
// Bootstrap
@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/variables";
@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/mixins";
@import "../bower_components/bootstrap-sass/assets/stylesheets/bootstrap/list-group";
.list-group {
max-width: 400px;
}