Bootstrap

1、他是一个前端流行的框架,他为我们提供了:

    css、js、一些图标。

2、安装bootstrap

<!-- 引入Bootstrap核心样式文件(必须) -->
<link rel="stylesheet" href="css/bootstrap.min.css">
<!-- 引入Bootstrap默认主题样式(可选) -->
<link rel="stylesheet" href="css/bootstrap.theme.min.css">
<!-- 由于Bootstrap的JS插件依赖jQuery,so 引入jQuery -->
<script src="js/jquery.min.js"></script>
<!-- 引入所有的Bootstrap的JS插件 -->
<script src="bootstrap.min.js"></script>
<!-- 你自己的脚本文件 -->
<script src="example.js"></script>

3、基础的bootstrap模板

  这三个meta标签必须放到head标签的最前面。

<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

   标签的含义:

  ①设置htnl文档的编码格式

  ②viewport——视口:在移动浏览器中,当页面宽度超出设备,浏览器内部虚拟的一个页面容器,将页面容器缩放到设备这么大,然后展示

     视口的宽度

   initial-scale:初始化缩放

     user-scalable:是否允许用户自行缩放(值:yes/no; 1/0)

     minimum-scale:最小缩放,一般设置了用户不允许缩放,就没必要设置最小和最大缩放
     maximum-scale:最大缩放

    设置之后,最终效果就是:网页中的1px等于真实的1px。

  ③设置浏览器的兼容版本模式,主要是考虑到IE这个“神”一样的浏览器

4、条件注释

  如果条件满足就会被执行, 虽然他是注释。

  responde的作用是让低版本浏览器也可以使用html5.如果相兼容更多浏览器,还是要加上这两个js文件的。只不过把他们放到条件注释里面。

<!--[if lt IE 9]>
      <script src="lib/html5shiv/html5shiv.min.js"></script>
      <script src="lib/respond/respond.min.js"></script>
<![endif]-->
原文地址:https://www.cnblogs.com/sylz/p/5787300.html