bootstrap学习总结-01 环境准备
2016-09-02 23:39
330 查看
1 下载Bootstrap
Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目。当前下载的Bootstrap版本为v3.3.7http://getbootstrap.com/ http://v3.bootcss.com/ http://www.runoob.com/bootstrap/bootstrap-tutorial.html
2 Bootstrap包含的文件
css: Bootstrap最重要的部分,预先设计好的样式文件。
fonts: Bootstrap用到的字体。
js: Bootstrap用到的JS插件。
3 使用Bootstrap
现在网页中使用Bootstrap需要在网页中加载Bootstrap用到的css样式表,js文件。1) BootStrap的JS插件依赖于Jquery库,需要在以下网站下载Jqeruy:
http://jquery.com/
2) 编写第一个Bootstrap
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title></title> <link rel="stylesheet" href="css/index.css" /> <meta name="viewport" content="width=device-width,initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <link rel="icon" href="./img/index.png"> <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css"> <!-- jQuery文件。务必在bootstrap.min.js 之前引入 --> <script src="http://cdn.bootcss.com/jquery/1.11.1/jquery.min.js"></script> <!-- 最新的 Bootstrap 核心 JavaScript 文件 --> <script src="http://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> </head> <body> <div class="container"> <h1 class="page-header">使用<small>Bootstrap编写网页</small></h1> <p>helloWorld </p> </div> </body> </html>
相关文章推荐
- Android应用开发学习总结(一)——环境搭建与基础准备
- SoapUI 学习总结-01 环境配置
- HTML5学习总结-01 开发环境和历史
- Bootstrap学习总结笔记(1)--环境配置
- Python学习笔记[01]-Python开发环境准备
- Python学习总结 01 配置环境
- Qt学习之_01环境准备_Qt安装、Git安装、QtCreator配置
- WPF学习笔记(01) - 准备起航
- Cocos2d-x学习笔记(一) —— 详细的环境搭建问题总结
- lucene3.5学习笔记01--搭建开发环境
- 开始hadoop前的准备:ubuntu学习笔记-基本环境的搭建(ssh的安装,SecureCRT连接,vim的安装及使用、jdk的安装)
- hadoop学习准备环境:ubuntu学习笔记-基本环境的搭建
- 最近准备做一个C++模式设计方面的学习总结,希望有路过看见的人推荐一下
- 【Android自动化测试】01. 知识准备&环境配置
- struts2小项目学习01之环境的搭建
- Activiti5学习之【准备环境】
- jbpm4.4学习总结(一)搭建环境、jpdl流程图
- jqGrid分页技术学习(一)jqGrid环境准备
- [Firefox][扩展系列][01]开发环境准备
- cocos2d-x学习笔记01:VS开发环境搭建