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

BootStrap 个人总结精品学习手册 1 工具 Bootlint Bootlint 是 Bootstrap 官方所支持的 HTML 检测工具。在使用了 Bootstrap 的页面上(没有对 Bootstrap 做修改和扩展的情况下),它能自动检查某些常见的 HTML 错误。纯粹的 Bootstrap 组件需要固定的 DOM 结构。 Bootlint 就能检测你的页面上的这些“纯粹”的 Bootstrap 组件是否符合 Bootstrap 的 HTML 结构规则。建议将 Bootlint 加入到你的开发工具中,这样就能帮你在项目开发中避免一些简单的错误影响你的开发进度。社区 Bootstrap 有成熟、强大的社区。如果你希望随时获取 Bootstrap 的最新消息,请关注以下社区资源。?阅读并订阅 Bootstrap 官方博客。?通过 IRC ( irc. 服务器)与其他 Bootstrap 粉丝交流,我们在##bootstrap 频道。?如果使用 Bootstrap 过程中遇到问题,请在 StackOverflow 上交流。请搜索 twitter-bootstrap-3 关键词。?对于为 Bootstrap 修改或添加功能的开发者, 如果需要将自己修改的版本发布到 npm 或其他分发渠道时,应当为自己的包添加 bootstrap 关键字,以便大家能够通过关键字了解你所发布的东西。?参观其他同学基于 Bootstrap 构建的网站,请进这里: Bootstrap Twitter 上关注英文官方账号***@getbootstrap ,这里有最新的八卦和有趣的视频。( :(原来和技术不沾边啊!) 中国用户请关注我们的官方微博账号: ***@Bootstrap 中文网。我们定期分享新技术和新资讯。禁止响应式布局 Bootstrap 会自动帮你针对不同的屏幕尺寸调整你的页面,使其在各个尺寸的屏幕上表现良好。下面我们列出了如何禁用这一特性,就像这个非响应式布局实例页面一样。禁止响应式布局有如下几步: 1. 移除此 CSS 文档中提到的设置浏览器视口( viewport )的标签: <meta> 。 2. 类设置一个 width 值从而覆盖框架的默认 width 设置,例如 width: 970px !important; 。请确保这些设置全部放在默认的 Bootstrap CSS 文件的后面。注意, 如果你把它放到媒体查询中,也可以略去!important 。 ,需要移除所有导航条的折叠和展开行为。 4. 对于栅格布局,-xs-* -md-* -lg-* 。不要担心,针对超小屏幕设备的栅格系统能够在所有分辨率的环境下展开。针对 IE8 仍然需要额外引入 文件(由于仍然利用了浏览器对媒体查询( media query )的支持,因此还需要做处理)。这样就禁用了 Bootstrap 对移动设备的响应式支持。禁止响应式特性的 Bootstrap 模版我们已经按照上面的步骤制作了一份案例。仔细阅读其源码并对照上面的步骤实践一下吧。非响应式布局实例从 版本升级到 版本你在找从老版本升级到 Bootstrap 版本的方法吗?请查看我们整理的升级指南吧。浏览器和设备的支持情况 Bootstrap 的目标是在最新的桌面和移动浏览器上有最佳的表现,也就是说, 在较老旧的浏览器上可能会导致某些组件表现出的样式有些不同,但是功能是完整的。被支持的浏览器特别注意,我们坚决支持这些浏览器的最新版本。在 Windows 平台,我们支持 Explorer 8-11 。请看下面列出的详细信息。 Bootstrap 在 Chromium 和 Linux 版 Chrome 、 Linux 版 Firefox 和 Explorer 7上的表现也是很不错的,虽然我们不对其进行官方支持。浏览器 bug 列表中列出了影响 Bootstrap 正常功能的浏览器 bug 。 Chrome Firefox Explorer Opera Safari Android 支持支持 N/A 不支持 N/A iOS 支持 N/A不支持支持 Mac OSX支持支持支持支持 Windows 支持支持支持支持不支持 Explorer 8和9 Explorer 8和9是被支持的,然而,你要知道,很多 CSS3 属性和 HTML5 元素-- 例如,圆角矩形和投影-- 是肯定不被支持的。另外, Explorer 8需要 配合才能实现对媒体查询( media query )的支持。 Feature Explorer 8 Ex