BootStrap个人总结精品学习手册教程.docx

BootStrap个人总结精品学习手册1 工具  HYPERLINK /getting-started/ \l tools-bootlint Bootlint  HYPERLINK /twbs/bootlint Bootlint?是 Bootstrap 官方所支持的 HTML? HYPERLINK /wiki/Lint_(software) 检测工具。在使用了 Bootstrap 的页面上（没有对 Bootstrap 做修改和扩展的情况下），它能自动检查某些常见的 HTML 错误。纯粹的 Bootstrap 组件需要固定的 DOM 结构。Bootlint 就能检测你的页面上的这些“纯粹”的 Bootstrap 组件是否符合 Bootstrap 的 HTML 结构规则。建议将 Bootlint 加入到你的开发工具中，这样就能帮你在项目开发中避免一些简单的错误影响你的开发进度。 社区 Bootstrap 有成熟、强大的社区。如果你希望随时获取 Bootstrap 的最新消息，请关注以下社区资源。 阅读并订阅? HYPERLINK / Bootstrap 官方博客。 通过 IRC （?服务器）与其他 Bootstrap 粉丝交流，我们在? HYPERLINK irc:///%23bootstrap ##bootstrap 频道。 如果使用 Bootstrap 过程中遇到问题，请在? HYPERLINK /questions/tagged/twitter-bootstrap-3 StackOverflow 上交流。请搜索?twitter-bootstrap-3?关键词。 对于为 Bootstrap 修改或添加功能的开发者，如果需要将自己修改的版本发布到? HYPERLINK /browse/keyword/bootstrap npm?或其他分发渠道时，应当为自己的包添加?bootstrap?关键字，以便大家能够通过关键字了解你所发布的东西。 参观其他同学基于 Bootstrap 构建的网站，请进这里： HYPERLINK / Bootstrap 优站精选. 你还可以在 Twitter 上关注英文官方账号? HYPERLINK /getbootstrap @getbootstrap?，这里有最新的八卦和有趣的视频。（ :( 原来和技术不沾边啊！） 中国用户请关注我们的官方微博账号： HYPERLINK /bootcss @Bootstrap中文网。我们定期分享新技术和新资讯。 禁止响应式布局 Bootstrap 会自动帮你针对不同的屏幕尺寸调整你的页面，使其在各个尺寸的屏幕上表现良好。下面我们列出了如??禁用这一特性，就像这个 HYPERLINK /examples/non-responsive/ 非响应式布局实例页面一样。  HYPERLINK /getting-started/ 禁止响应式布局有如下几步： 移除? HYPERLINK /css/ \l overview-mobile 此 CSS 文档中提到的设置浏览器视口（viewport）的标签：meta。 通过为?.container?类设置一个?width?值从而覆盖框架的默认 width 设置，例如?width: 970px !important;?。请确保这些设置全部放在默认的 Bootstrap CSS 文件的后面。注意，如果你把它放到媒体查询中，也可以略去!important?。 如果使用了导航条，需要移除所有导航条的折叠和展开行为。 对于栅格布局，额外增加?.col-xs-*?类或替换掉?.col-md-*?和?.col-lg-*。 不要担心，针对超小屏幕设备的栅格系统能够在所有分辨率的环境下展开。 针对 IE8 仍然需要额外引入 Respond.js 文件（由于仍然利用了浏览器对媒体查询（media query）的支持，因此还需要做处理）。这样就禁用了 Bootstrap 对移动设备的响应式支持。  HYPERLINK /getting-started/ \l bootstrap 禁止响应式特性的 Bootstrap 模版 我们已经按照上面的步骤制作了一份案例。仔细阅读其源码并对照上面的步骤实践一下吧。  HYPERLINK /examples/non-responsive/ 非响应式布局实例 从 v2.x 版本升级到 v3.x 版本 你在找从老版本升级到 Bootstrap v3.x 版本的方法吗？请查看我们整理的 HYPERLINK /migration 升级指南吧。 浏览器和设备的支持情况 Bootstrap 的目标是在最新的桌面和移动浏览器上有最佳的表现，也就是说