01.Bootstrap入门
Bootstrap介绍：
Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快捷。它由Twitter的设计师Mark Otto和Jacob Thornton合作开发，是一个CSS/HTML框架。Bootstrap提供了优雅的HTML和CSS规范，它即是由动态CSS语言Less写成。Bootstrap一经推出后颇受欢迎，一直是GitHub上的热门开源项目，包括NASA的MSNBC（微软全国广播公司）的Breaking News都使用了该项目。国内一些移动开发者较为熟悉的框架，如WeX5前端开源框架等，也是基于Bootstrap源码进行性能优化而来。
如何将Bootstrap文档引入自己的项目中
Step 1：打开官网 http://www.bootcss.com/（Bootstrap中文网），点击蓝色背景bootstrap3中文文档
Step 2: 点击“下载Bootstrap”
Step 3: 用于生产环境的Bootstrap
Step 4: 将下载的压缩包解压缩到自己开发项目的根目录中
Step 5: 新建html文件，并将css，js相关的文件引入至html中
要将网站引入的地址改成本地地址
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<!-- 新 Bootstrap 核心 CSS 文件 -->
<link rel="stylesheet" href="./css/bootstrap.min.css"> <!-- 可选的Bootstrap主题文件（一般不用引入） -->
<link rel="stylesheet" href="./css/bootstrap-theme.min.css"> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
<script src="./js/jquery.min.js"></script> <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
<script src="./js/bootstrap.min.js"></script>
<title>bootstrap入门</title>
</head>
<body>
</body>
</html>
请注意，Bootstrap 的所有 JavaScript 插件都依赖 jQuery，因此 jQuery 必须在 Bootstrap 之前引入。 jQuery文件要从引入的地址下载下来 http://cdn.bootcss.com/jquery/1.11.3/jquery.min.js放至js目录下。
Step 6： 添加div元素，引入类well
<body>
<div class="well">Hello World</div>
</body>
=======================测试成功==============================
如何添加响应式设置
在导航中选择全局CSS样式
将代码复制到<head></head>中。
01.Bootstrap入门的更多相关文章
- Bootstrap入门（二）栅格
Bootstrap入门(二)栅格 Bootstrap入门(二)栅格 全局CSS样式--栅格 先引入本地的CSS文件(根据自己的文件夹,有不同的引入地址,我是放在一个新建的名为css的文件夹中) con ...
- BootStrap入门教程 (一)
BootStrap入门教程 (一) 2011年,twitter的"一小撮"工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用.优雅.灵活.可扩展的前端 ...
- bootstrap 入门
bootstrap 入门 <!DOCTYPE html> <html> <head lang="en"> <meta charset=&q ...
- Bootstrap入门（三十）JS插件7：警告框
Bootstrap入门(三十)JS插件7:警告框 通过这个插件可以为警告信息添加点击以及消失的功能. 当使用一个.close按钮,它必须是第一个子元素.alert-dismissible,并没有文字内 ...
- Bootstrap入门（二十九）JS插件6：弹出框
Bootstrap入门(二十九)JS插件6:弹出框 加入小覆盖的内容,像在iPad上,用于存放非主要信息 弹出框是依赖于工具提示插件的,那它也和工具提示是一样的,是需要初始化才能够使用的 首先我们引入 ...
- Bootstrap入门（二十八）JS插件5：工具提醒
Bootstrap入门(二十八)JS插件5:工具提醒 工具提示在使用过程中比较常见,但是实现起来有些麻烦,而bootstrap则很好地解决了这个问题. 我们来写一个简单的实例 先引入CSS文件和JS文 ...
- Bootstrap入门（二十七）JS插件4：标签页
Bootstrap入门(二十七)JS插件4:标签页 标签页的切换可以带动内容的变化 首先我们引入CSS文件 <link href="bootstrap.min.css" re ...
- Bootstrap入门（二十五）JS插件2：过渡效果
Bootstrap入门(二十五)JS插件2:过渡效果 对于简单的过渡效果,只需将 transition.js 和其它 JS 文件一起引入即可.如果你使用的是编译(或压缩)版的bootstrap.js ...
- Bootstrap入门（二十四）data属性
Bootstrap入门(二十四)data属性 你可以仅仅通过 data 属性 API 就能使用所有的 Bootstrap 插件,无需写一行 JavaScript 代码.这是 Bootstrap 中的一 ...
随机推荐
- sass基础编写流程
这是之前整理在word上的基础流程 sass是Ruby语言开发的一个用于动态编程css文件的框架 所以sass的运行依赖Ruby环境 所以要先安装Ruby 参见详细教程(安装参照慕课网有详细的教程) ...
- C# 文件选择对话框，Unity3d文件保存对话框
using OpenWinForm = System.Windows.Forms; 在unity3d中,使用FileDialog应该把System.Windows.Forms.dll拷贝到unity工 ...
- Winscp sftp远程linux服务器需要预设密码，怎么解决
需要在root账户下修改/etc/ssh/sshd_config 文件中PermitEmptyPasswords no改成yes
- github中redme添加图片
README文件后缀名为md.md是markdown的缩写,markdown是一种编辑博客的语言.格式如下:  即 叹号! + 方括号[ ] + 括号( ) 其中叹号里是图片的 ...
- django中间件
django的中间件就是一个对整体请求过程的装饰器,可以对请求到达view之前,view处理和响应后,通过定义process_request,process_view,process_response ...
- Winform绑定数据源的几种方式？
第一种:DataSet ds=new DataSet (); this.dataGridView1.DataSource=ds.Table[0]; 第二种:DataTable dt=new DataT ...
- js按钮浮动随手指方向移动而移动
window.document.getElementById("moveDIV").addEventListener("touchmove", function ...
- 创建Maven web项目时 出现 web.xml is missing and <failOnMissingWebXml> is set to true错误 pox.xml编译错误
今天创建一个maven项目 pom.xml出现如下错误: web.xml is missing and <failOnMissingWebXml> is set to true 这是因为你 ...
- 如何能让hadoop或者spark等处理excel文件——保存成csv
工作中遇到一个表,用来筛选信息. 但是表现在是excel,为了能在spark中使用,找了下解决办法 http://stackoverflow.com/questions/4125385/java-ho ...
- 架设lamp服务器后，发现未按照 Apache xsendfile模块，
今天在架设lamp服务器后,发现apache 未按照xsendfile模块,于是查找资料按照如下: 安装apache xsendfile模块yum install mod_xsendfile