从twitter-bootstrap迁移到zurb-foundation

Question

我已经使用Twitter bootstrap实现我的简单blog已经有很长一段时间了，我期待着迁移到bootstrap3。然而，我也读到了一些关于Zurb Foundation的非常好的东西，在转到bootstrap3之前，我想先试一试。

当涉及到客户端技术时，我是一个小菜鸟，所以我希望得到一些关于如何从bootstrap迁移到Foundation的建议。这是一次直接的迁移，还是一次棘手的迁移？

希望能从这一领域的专家那里得到一些公正的意见。

Answer 1

我不认为这是一个简单的过程。您需要更改HTML的结构函数、类和ids。

例如，如果你想要一个下拉菜单，你会得到如下所示。

<div class="dropdown">
  <a class="dropdown-toggle" data-toggle="dropdown" href="#">Dropdown trigger</a>
  <ul class="dropdown-menu" role="menu" aria-labelledby="dLabel">
    ...
  </ul>
</div> 

如果您想使用Foundation，则需要将HTML更改为如下所示。

<a href="#" data-dropdown="drop1">Has Dropdown</a>
<ul id="drop1" class="f-dropdown" data-dropdown-content>
  <li><a href="#">This is a link</a></li>
  <li><a href="#">This is another</a></li>
  <li><a href="#">Yet another</a></li>
</ul>

显然，CSS会有所不同，但我想你会从迁移中期待它。我能想到的另一件事是，foundation使用Sass，与bootstrap一样，所以如果您编写了更少的代码，则需要将其更改为Sass。

希望这能有所帮助。

Answer 2

我会坚持使用bootstrap。覆盖bootstrap的样式比基础4更难-但文档更好。

正如您从前面的答案中看到的-迁移将是相当痛苦的。如果你想使用Foundation，从头开始会更容易。而且基础5的设置可能会非常痛苦。

我强烈建议你学习使用Bootstrap来减少使用。(或SASS/Compass for Foundation。)与原始的CSS相比，定制要轻松得多。