“这是我参与8月更文挑战的第23天，活动详情查看： 8月更文挑战”
上一篇(传送门)我们一起学习了Bootstrap的简介，了解了Bootstrap的作用和使用方式，以及Bootstrap环境的基本搭建，本篇我们继续来学习Bootstrap的基本模板的创建以及模板讲解。
Bootstrap基本模板创建
首先使用Hbuilder打开咱们昨天搭建好的bootstrap。
新建一个目录叫做基本模板，然后新建一个html文件。
接着点击传送门找到基本模板。
复制基本模板的全部代码到新建的HTML文件中。
我们需要对这些代码进行一些修改，把css文件和js文件的路径修改到我们本地的文件位置。其中的一些注释我们也用不到，可以直接删除。
到此我们的基本模板已经创建完成了。下面我们来进行一下分析。
Bootstrap基本模板讲解
我们针对代码来依次进行讲解。
<html lang="zh-CN">HTML页面使用的是中文简体。
<meta charset="utf-8">设置HTML页面的字符集是utf-8。
<meta http-equiv="X-UA-Compatible" content="IE=edge">使用IE浏览器最新的渲染模式展示页面。
<meta name="viewport" content="width=device-width, initial-scale=1">
这里面有一个viewport(视口)，视口是浏览器中网页的可视区域。 视口的作用就是：用于移动设备，将大型页面进行比例缩放显示。
需要注意的是以下的设置只在移动设备上生效：
- width=device-width。设置视口的宽度，device-width是设备宽度。
- initial-scale=1。初始化缩放设置，移动设备打开网页时的缩放级别，1就表示100%，即正常显示。
视口的常见设置（了解):
vwidth=device-width 视口的宽度，大多手机浏览器视口的宽度是980。
device-width表示采用设备的宽度例如:手机是5.5寸，
那么视口也采用5.5寸宽度
initial-scale=1. 移动设备上，打开页面时的初始化缩放级别。取值:1-5，
1表示100%，5表示500%
minimum-scale=1· 移动设备上，页面可以最小缩放的级别。
maximum-scale=1 移动设备上，页面可以最大缩放的级别。
user-scalable=no: 移动设备上，页面禁止缩放。
如果设置“user-scalable=no”，则“minimum-scale”和“maximum-scale”无效。
写在最后
好了，关于Bootstrap的基本模板的创建以及讲解咱们就学习到这里，如有不正之处，欢迎掘友们批评指正。下篇我们就开始一步步学习Bootstrap的一些特效。
