Bootstrap
概述：
是最受欢迎的HTML,CSS和JS框架,用于开发响应式布局,移动设备优先的WEB项目.
Bootstrap是基于jquery开发的,在使用时需要引入jquery的js文件.
响应式:一个网页可以兼容多种终端
JQuery是对js的封装
下载BootStrap:
www.bootcss.com官网地址
模板☆
1:导入BootStrap的css
2:导入jquery的js文件(1.8+)
3:导入BootStrap的js
4:设置视口(支持移动设备)
<meta name="viewport" content="width=dvice-width,initial-scale=1">
5:添加一个局部容器
给div设置一个class属性:
class="containner"固定宽度
class="container-fluid"类似于100%
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!--4.添加视口-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<title></title>
<!--1.导入Bootstrap的css文件-->
<link href="css/bootstrap.css" rel="stylesheet">
<!--2.导入jQuery的js文件-->
<script src="js/jquery-3.2.1.min.js"></script>
<!--3.导入bootstrap的js文件-->
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<div style="border: solid 1px red;height: 20px;"></div>
<!--5.添加布局容器-->
<div class="container-fluid">
<div style="border: 1px solid red;height: 20px;"></div>
</div>
<div class="container">
<div style="border: 1px solid red;height: 20px;"></div>
</div>
</body>
</html>