引入下载的css和js。
或者：
<!-- 新 Bootstrap4 核心 CSS 文件 -->
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/css/bootstrap.min.css">
<!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="https://cdn.staticfile.org/jquery/3.2.1/jquery.min.js"></script>
<!-- bootstrap.bundle.min.js 用于弹窗、提示、下拉菜单，包含了 popper.min.js -->
<script src="https://cdn.staticfile.org/popper.js/1.15.0/umd/popper.min.js"></script>
<!-- 最新的 Bootstrap4 核心 JavaScript 文件 -->
<script src="https://cdn.staticfile.org/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script>
容器
1.流体容器：
width：auto
2.固定容器：
阈值： width
大于等于1200(lg大屏pc) 1170 (1140+槽宽
大于等于992(md中屏pc) 970 (940+槽宽)
小于1200大于等于768(sm平板) 750 (720+槽宽)
小于992
小于768(xs移动手机) auto
行：row 两侧-15px margin
类名以？开头：
3.栅格系统
栅格源码分析
1.流体容器&固定容器公共样式
margin-right: auto;
margin-left: auto;
padding-left: 15px;
padding-right: 15px;
2.固定容器特定样式
顺序不可变
@media (min-width: @screen-sm-min) {
width: @container-sm;
@media (min-width: @screen-md-min) {
width: @container -md;
@media (min-width: @screen-lg-min) {
width: @container-lg;
列：当为lg尺寸时div占列的3/12，当为md尺寸时占列的4/12，当为sm尺寸时占列的6/12
列的偏移量：push表示想右，pull表示向左偏移，下面的意思是：该列想右偏移3/12个单位
col-*-offset使用的是margin-left属性实现右移 col-*-push使用的是float + left属性实现右移
注意：阅值上样式的设置不能跳跃
公共样式:
两侧有15px的padding
相对定位
float
width 1~12
left，right 0~12 0: auto
margin-left：0~12
写客户端时要加上在手机端的meta
响应式工具：
显示类：
隐藏类：
栅格盒模型设计的精妙之处：
容器两边具有15px的padding
行两边具有-15px的margin
列两边具有15px的padding
为了维护槽宽的规则：列两边必须得要15px的padding
为了能使列嵌套行：行两边必须要有 -15px的margin
为了让容器可以包裹住行：容器两边必须要有15px的paddingl
less的继承
#test{
&:extend( . father)
}
#test:extend( . father){
继承实质上将。father选择器和#test组合成一个选择器，
声明块使用。father的
all:继承所有和.father相关的声明块
切记父类不能定义成混合(继承不灵活性能高混合灵活性能低)
less的避免编译
~"不会被编译的内容"
变量在less中属于块级作用域，延迟加载