Bootstrap的head模板
投稿于 被查看 34835 次 评论：205
Bootstrap的head模板
- 本地版
注意：如果你要用B框架写一些网页内容，本地引用必须要把相应的文件复制到你做的项目文件中
html 代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<!--为了确保适当的绘制和触屏缩放，要添加以下的代码-->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!--在移动设备浏览器上，通过为视口（viewport）设置 meta 属性为 user-scalable=no 可以禁用其缩放（zooming）功能。这样禁用缩放功能后，用户只能滚动屏幕，就能让你的网站看上去更像原生应用的感觉。注意，这种方式我们并不推荐所有网站使用，还是要看你自己的情况而定！
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
-->
<link rel="stylesheet" type="text/css" href="bootstrap.min.css">
<!--注意：jquery文件必须在bootstrap.min.js文件之前引入-->
<script type="text/javascript" src="jquery-2.2.2.min.js"></script>
<script type="text/javascript" src="bootstrap.min.js"></script>
</head>
<body>
</body>
</html>
- 网络版
注意：这种可能在加载速度上会慢一些，但也不会差距太大
html 代码
<!DOCTYPE html> <html> <head> <title>Bootstrap 模板</title> <meta charset="utf-8"> <!--为了确保适当的绘制和触屏缩放，要添加以下的代码--> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <!--在移动设备浏览器上，通过为视口（viewport）设置 meta 属性为 user-scalable=no 可以禁用其缩放（zooming）功能。这样禁用缩放功能后，用户只能滚动屏幕，就能让你的网站看上去更像原生应用的感觉。注意，这种方式我们并不推荐所有网站使用，还是要看你自己的情况而定！ <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> --> <link href="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"> <!--注意：jquery文件必须在bootstrap.min.js文件之前引入--> <script src="http://cdn.static.runoob.com/libs/jquery/2.1.1/jquery.min.js"></script> <script src="http://cdn.static.runoob.com/libs/bootstrap/3.3.7/js/bootstrap.min.js"></script> </head> <body> </body> </html>
用户评论