海创软件组--vue项目使用bootstrap

！需要注意！bootstrap组件库是基于jquery写的，所以要使用bootstrap首先要下载配置jquery。

jquery的下载配置，详情可点击jquery安装链接查看

一：下载bootstrap：
1、可打开bootstrap官网下载文件
2、也可以在终端控制台输入：npm install -s [e-mail]版本下载文件

二：在main文件中引入bootstrap

import '../node_modules/bootstrap/dist/css/bootstrap.min.css'
import '../node_modules/bootstrap/dist/js/bootstrap.min.js

三：演示

<template>
  <div>
    <div class="container out">
      <div class="col-lg-3 one">
      </div>
      <div class="col-lg-3 two">
      </div>
      <div class="col-lg-3 three">
      </div>
      <div class="col-lg-3 four">
      </div>
    </div>
  </div>
</template>
<script>
  export default {
    name: 'demo',
    mounted () {

    }
  }
</script>
<style lang="less">
  .out{
    height: 300px;
    div{
    	height:100%;
    }
    .one{
      background-color: red;
    }
    .two{
      background-color: green;
    }
    .three{
      background-color: blue;
    }
    .four{
      background-color: yellow;
    }
  }
</style>

更多详情可打开bootstrap官网查看。