在大项目上更新Bootstrap

时间:2018-02-09 12:53:52

标签: css twitter-bootstrap bootstrap-4

所以我正在开发一个使用bootstrap 2.3.2样式表和bootstrap 3.0.0 .js 脚本的项目。客户端已经过时(很多),我的第一个目标是替换引导程序文件,这样我就可以开始使用最新版本,删除写得不好的CSS并使用更新的类和引导v4的东西。

那么,我现在关注的是什么?我担心旧的bootstrap类不再起作用了。较新的版本是否支持旧版本的类和CSS?我还需要考虑其他因素吗?

2 个答案:

答案 0 :(得分:3)

我会将bootstrap 2.3.2 docs与bootstrap 4进行​​比较。我不相信bootstrap 4为2.3.2样式表提供任何向后兼容性,并且网格系统似乎完全不同。

所以我想说的第一个停靠点是检查你将如何更新网站布局。

v2.3.2文档:http://getbootstrap.com/2.3.2/index.html

v4文档:https://getbootstrap.com/docs/4.0/getting-started/introduction/


<小时/>

编辑:我在Bootstrap 2.3.2上做了一些阅读,其中一个主要区别是响应式bootstrap的工作原理。默认情况下,Bootstrap 2.3.2中不启用响应功能,但可以使用其他样式表启用响应功能。

如果网站已启用响应,则可能基于您在此页面上可以看到的媒体查询:http://getbootstrap.com/2.3.2/scaffolding.html#responsive

将其与v4 grid进行比较,您将看到媒体查询的大小略有不同,现代引导程序使用一致的30px装订线(列的两侧各15px),而不是不一致的装订线宽度在v2.3.2。

该网站还可以使用“响应实用程序类”来隐藏某些屏幕尺寸的元素。如果您希望保留这些内容,那么您在这些页面上找到类似课程的最大希望就是:


或者,如果网站未启用响应,则您可能需要重新考虑页面布局。两个版本的Bootstrap都使用12列网格,但容器大小似乎不匹配。


需要注意的其他事项:

  • 正如我在回答中所说,对支持glyphicons的支持已被删除。 v4迁移指南确实提供了一些alternatives
  • 按钮类(以及其他几个基本组件,例如进度条)似乎非常匹配,但是这些和其他元素的样式与仍保留在bootstrap 4中的类显然会发生变化 -Dropdowns看起来可能仍然适用于新的js或几乎没有调整。


我确信不仅仅是这个,而是我在快速浏览旧文档时可以找到的内容。

祝你好运

答案 1 :(得分:2)

我首先考虑他们关于迁移到v4的教程:

https://getbootstrap.com/docs/4.0/migration/

对于我们的项目,主要问题是不再支持glyphicons,因此我们不得不替换它们:

https://getbootstrap.com/docs/4.0/migration/#components