Bootstrap——页面基本样式

1.Bootstrap简介
Bootstrap是简洁的,平面化的,移动端设备优先的,html/css框架,由三部分组成:

  1. css样式:可以去官网下载最新版本,或者直接引入链接 http://netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css “;

  2. js脚本:里面有一些js插件,和jQuery插件不一样,需要下载或直接引入链接 http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js ;

  3. fonts字体:里面引入了字体图标,在用的时候可以引入相应的类名,不用再插入图片


2.使用插件时应注意

  1. 将css样式放在最顶端,js脚本放在body标签的底部,为了更好的响应移动端设备
  2. 应引入 <meta name="viewport" content="width=device-width, initial-scale=1"> ,content属性值指:让页面宽度等于浏览器的宽度,initial-scale属性值指:页面在显示时不做缩放,自适应浏览器。

3.Bootstrap页面的最基本样式

<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>基本用法</title>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css">
</head>

<body>
  <div>
      hello world!
  </div>
<script type="text/javascript" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
</body>
</html>
-------------本文结束感谢您的阅读-------------