如果您想让升级路径尽可能轻松，您将如何使用 bootstrap 2.3.2 编写新应用程序？
例如，我知道span-和col-类正在消失，所以我将为每个具有该定义的 mixin 的类创建一个自定义的更少类，或者在我的模板语言中创建一个宏来输出类名而不是使用它直接地。
另外，是否有 bootstrap 3 迁移指南？我找不到一个。
那么，您将采取哪些步骤来简化升级？
问问题
5948 次
1 回答
12
Bootstrap 3 尚未正式发布，但您可以从https://github.com/twitter/bootstrap/archive/3.0.0-wip.zip下载最新代码。您还可以编译文档以检查差异，请参阅：编译 Twitter bootstrap 3 文档（如何）？.
Bootstrap 3 RC1现已发布。
Twitter 的 Bootstrap 3 不会向后兼容第 2 版，因此迁移在某种程度上总是很痛苦。
Twitter 的 Bootstrap 3 将有一个流畅的网格（默认情况下），因此它也有助于构建具有流畅布局的第 2 版模板。其他重要的变化是：
- TB3 将首先是移动的
- 不支持 IE7 和 Firefox 3.x
- 没有单独的响应式 CSS 文件。
我喜欢你为迁移制作 mixin 的想法。Twitter 的 Bootstrap 3 定义了三个网格：用于手机的小网格 (<480px)、用于平板电脑的小网格 (<768px) 和用于 Destkops 的中大网格 (>768px)。这些网格的行类前缀是“.col-”、“.col-sm-”和“.col-lg-”。中大型网格将堆叠在 768 像素以下的屏幕宽度之下。小于 480 像素的小网格也是如此，小网格永远不会堆叠。除了总是会堆叠元素的旧手机（移动优先设计）。
Twitter 的 Bootstrap 2 在 480px、768px、980px 和 1200px 处定义了断点。布局将始终在 768 像素以下流畅。
出于这个原因，“旧”span*将与col-*or不同col-lg-*。所以替换模板中的类名会给你更好的结果。但是当查看像http://examples.getbootstrap.com/jumbotron/index.html这样的示例时，您会发现col-lg-*该类代替了前一个span*类。在这种情况下，这将使您有可能为 span* 创建一个与 col-lg-* 样式相同的 mixin。
响应功能
当您开始迁移时，您还必须决定是否使用响应式功能。Bootstrap 3 不再有单独的响应式 CSS 文件。
没有响应功能 不想拥有响应功能的人必须为您的行类使用“.col-”前缀。这个网格永远不会堆叠。您还必须将 grid-float-breakpoint 设置为 0。使用 Less 时，@grid-float-breakpoint 将在 variables.less 中定义。请记住，表单和模式等其他部分也使用@grid-float-breakpoint。另见：http ://bassjobsen.weblogs.fm/compile-twitters-bootstrap-3-without-responsive-features/
使用响应式功能 在大多数情况下，您将使用响应式功能。迁移时，您必须在“.col-sm-”和“.col-lg-”之间进行选择，以替换旧的“span”前缀。上面所说的“col-lg-”很可能会给你和以前一样的行为。“col-lg-”将堆叠在 768px 以下。在这种情况下，还要考虑网格浮点断点。默认情况下，grid-float-breakpoint 为 768px。
注：目前为 TB2.3.2。已在主站点上替换为 Bootstrap 3 RC1。所以考虑从一开始就用TB3。有关网格的更多示例，另请参见http://examples.getbootstrap.com/grid/。
相关问题及更多：
另请阅读来自@skelly的https://stackoverflow.com/a/17977432/1596547答案，它提供了两个有用的链接：
http://bootply.com/bootstrap-3-migration-guide
正在开发的 Bootstrap 迁移工具：https ://github.com/iatek/bootstrap-migrate
于 2013-07-26T20:55:18.083 回答