一、Bootstrap介绍
Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架，用于开发响应式布局、移动设备优先的 WEB 项目。本课时讲解 Bootstrap 的概念，并介绍 Bootstrap 应用场景和如何下载。
中文官方网站：http://www.bootcss.com/
二、入门例子创建
下面讲解如何来使用 Bootstrap，通过引入 Bootstrap，来实现一个最基本的入门例子。@H_502_11@@H_502_11@
实现的效果如图所示：@H_502_11@@H_502_11@
代码如下：
<!@H_502_11@DOCTYPE html@H_502_11@>@H_502_11@
<@H_502_11@html@H_502_11@head@H_502_11@Meta @H_502_11@charset@H_502_11@="utf-8"@H_502_11@/>@H_502_11@
title@H_502_11@>@H_502_11@Bootstrap 模板</@H_502_11@name@H_502_11@="viewport"@H_502_11@ content@H_502_11@="width=device-width,initial-scale=1.0"@H_502_11@link @H_502_11@href@H_502_11@="css/bootstrap.css"@H_502_11@ rel@H_502_11@="stylesheet"@H_502_11@style @H_502_11@type@H_502_11@="text/css"@H_502_11@>@H_502_11@
body@H_502_11@{@H_502_11@padding-top@H_502_11@:@H_502_11@50px@H_502_11@;@H_502_11@}@H_502_11@
.starter@H_502_11@padding@H_502_11@40px 15px@H_502_11@text-align@H_502_11@ center@H_502_11@}@H_502_11@
style@H_502_11@body@H_502_11@nav @H_502_11@class@H_502_11@="navbar navbar-inverse navbar-fixed-top"@H_502_11@ role@H_502_11@="navigation"@H_502_11@>@H_502_11@
div @H_502_11@="container"@H_502_11@>@H_502_11@
="navbar-header"@H_502_11@>@H_502_11@
a @H_502_11@="#"@H_502_11@ class@H_502_11@="navbar-brand"@H_502_11@>@H_502_11@W3Cshoola@H_502_11@div@H_502_11@id@H_502_11@="navbar"@H_502_11@="collapse navbar-collapse"@H_502_11@ul @H_502_11@="nav navbar-nav"@H_502_11@>@H_502_11@
li @H_502_11@="active"@H_502_11@><@H_502_11@="#"@H_502_11@>@H_502_11@Home></@H_502_11@li@H_502_11@>@H_502_11@About>@H_502_11@Contactul@H_502_11@nav@H_502_11@="starter"@H_502_11@h1@H_502_11@>@H_502_11@Bootstrap starter templatep @H_502_11@="lead"@H_502_11@>@H_502_11@初学BootStrap初学BootStrap初学BootStrap初学BootStrap初学BootStrap初学BootStrap初学BootStrap初学BootStrap初学BootStrap初学BootStrapp@H_502_11@script @H_502_11@src@H_502_11@="js/jquery-1.11.3.min.js"@H_502_11@script@H_502_11@="js/bootstrap.min.js"@H_502_11@>@H_502_11@
三、全局css样式-排版
主要来了解排版中的标题、页面主体、内联元素文本、对齐、大小写、地址等的使用。@H_502_11@@H_502_11@
实例代码：
>@H_502_11@学习Bootstraph2@H_502_11@h3@H_502_11@h4@H_502_11@small@H_502_11@>@H_502_11@欢迎您的到来P@H_502_11@>@H_502_11@hellohellohellohellohellohelloP @H_502_11@abbr @H_502_11@="attribute"@H_502_11@>@H_502_11@helloabbr@H_502_11@>@H_502_11@Hello World:欢迎来到mark@H_502_11@>@H_502_11@Bootstrap学习知识del@H_502_11@>@H_502_11@
="text-left"@H_502_11@>@H_502_11@你好吗？="text-right"@H_502_11@="text-center"@H_502_11@="text-lowercase"@H_502_11@>@H_502_11@hdofdo="text-uppercase"@H_502_11@>@H_502_11@dfsodsfosdfo="text-capitalize"@H_502_11@>@H_502_11@dsfsdwederttaddress@H_502_11@strong@H_502_11@>@H_502_11@Bootstrapbr@H_502_11@>@H_502_11@
北京市，海淀区@H_502_11@
中关村大厦：10086
@H_502_11@="Phone"@H_502_11@>@H_502_11@P：8888 8888="list-unstyled"@H_502_11@>@H_502_11@1>@H_502_11@2>@H_502_11@3>@H_502_11@