Bootstrap-v5-简介(起步入门)
一、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