一、Bootstrap简介

1、Bootstrap是什么

  • Bootstrap是由Twitter推出的一个开源的前端开发框架。基于HTML/CSS/Javastrip，代码简介、视觉优美，用来快速开发基于PC及移动端的Web页面，更快速、简洁。
  • Bootstrap官网：https://getbootstrap.com/
  • Bootstrap中文文档：https://v3.bootcss.com/

 

2、Bootstrap的特点

  • 跨设备、跨浏览器（兼容所有主流的浏览器，包括IE7、IE8）
  • 响应式布局（支持PC端、移动端（手机、pad等），移动设备优先）
  • 提供了丰富的组件（表单、下拉列表、导航、徽章、面板、标签等）
  • 内置jQuery插件（模态框、工具提示、弹出框、轮播图等）
  • 支持动态样式（less、sass，可以使用变量、嵌套、混合等，编写样式更快更灵活）

 

二、Bootstrap起步

 1、下载Bootstrap

　　有两种方式下载Bootstrap：

  • 从bootstrap官网下载bootstrap
  • cmd运行cnpm install bootstrap

　　下载完成后，将bootstrap.css和bootstrap.js两个文件拷贝到项目中。另外，由于bootstrap是依赖于jquery的，因此还需要下载jquery，将jquery.js文件拷贝到项目中。

 

2、基本模板

  • HTML5文档类型
  • 移动端适配，移动设备优先
  • 基本的全局样式
  • 布局容器:.container和.container-fluid

Bootstrap简介（起步入门）_bootstrap