搜索
您的当前位置:首页正文

Bootstrap知识整理

来源:二三娱乐

Bootstrap作为最流行的Web前端UI框架(由twitter推出),是每个前端开发所必须了解的;经常听说Bootstrap,今天下午把Bootstrap的官方文档通读了下,然后动手试了一些效果,发现使用Bootstrap确实能够节省很多时间。里面一些常见的UI,我们只要复制黏贴代码即可实现相应的效果。不仅如此,它还默认支持响应式。
ps:上上个月在江西省公安厅交通管理局互联网交通安全服务管理平台帮老爸处理违章处罚发现它也使用了Bootstrap技术。

Paste_Image.png

一、Bootstrap2与Bootstrap3的区别

首先介绍下他们的主要区别:

(一)、在浏览器兼容性上
  • Bootstrap2能够兼容IE7及以上的浏览器;
  • Bootstrap3能够兼容IE8及以上的浏览器;
(二)、在页面的设计风格上
  • Bootstrap2采用的是凹凸渐变的设计风格;
凹凸渐变风格
  • Bootstrap3采用的是;
扁平化设计风格
(三)、移动优先方面
  • Bootstrap2 采用的是PC端优先的原则;

  • Bootstrap3采用的是移动端优先的原则;

ps: Bootstrap v4.0.0 现在也出来了~

二、初步使用

(一)、注意事项
  • 1、“行(row)”必须包含在 .container(固定宽度)或 .container-fluid (100% 宽度)中;
  • 2、只有“列(column)”可以作为行(row)”的直接子元素。
栅格参数
(二)、入门资料推荐
  • 1、 bootstrap v3.3.0中文文档
  • 2、 bootstrap v3.3.0英文官方文档
Top