1 <!-- 声明文档类型 为 html5 --> 2 <!DOCTYPE html> 3 <!-- 声明页面内容主要为 中文简体 --> 4 <html lang="zh-CN"> 5 <head> 6 <!-- 声明页面编码 为 utf-8 --> 7 <meta charset="utf-8"> 8 <!-- X-UA-Compatible 浏览器兼容模式 这是个是IE8的专用标记,用来指定IE8浏览器去模拟某个特定版本的IE浏览器的渲染方式(比如人见人烦的IE6),以此来解决部分兼容问题 --> 9 <!-- 详情见 http://www.cnblogs.com/lovecode/articles/3377505.html --> 10 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 11 <!-- 申明viewport 视口属性设置,只有在移动端才识别 12 其中属性有width = device-width 视口宽度等于 设备宽度 13 initial-scale = 1.0 初始化 缩放比为1:1 也就是等比显示 14 还有其他的属性: 15 user-scalable = 0 ;可选值1,0, 或 yes, no 16 用户是否允许缩放。 17 maximum = 1.0 最大缩放比 18 minimum = 1.0 最小缩放比 19 20 --> 21 <meta name="viewport" content="width=device-width, initial-scale=1"> 22 <!-- 上述3个meta标签*必须*放在最前面,任何其他内容都*必须*跟随其后! --> 23 <title>Bootstrap 模板</title> 24 25 <!-- Bootstrap --> 26 <link rel="stylesheet" href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css"> 27 <!-- respond 异步加载的 本地打开 不生效 需要使用服务器,例如在 Apache 上打开--> 28 <!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries --> 29 <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 30 31 32 <!-- 只有IE才识别的注释 --> 33 <!-- 不支持h5标签的浏览器需要引用 html5shiv.js 包 --> 34 <!-- 不支持媒体查询的浏览器 需引入 respond.js 包 --> 35 <!--[if lt IE 9]> 36 37 <script src="//cdn.bootcss.com/html5shiv/3.7.2/html5shiv.min.js"></script> 38 <script src="//cdn.bootcss.com/respond.js/1.4.2/respond.min.js"></script> 39 40 <![endif]--> 41 42 </head> 43 <body> 44 <!-- 删掉下面的标题 就可以填写内容了 --> 45 <h1>你好,世界!</h1> 46 <!-- 填写内容区 --> 47 48 49 50 <!-- jQuery (necessary for Bootstrap's JavaScript plugins) 51 52 bootstrap基于jQuery 所以jQuery要先引入 --> 53 54 55 <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script> 56 <!-- Include all compiled plugins (below), or include individual files as needed --> 57 <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script> 58 </body> 59 </html> 60 61