你的位置:首页 > 软件开发 > 网页设计 > BootStrap学习

BootStrap学习

发布时间:2015-11-03 18:00:04
一、Bootstrap简介BootStrap是由Twitter推出的前端框架,2011 年八月在 GitHub 上发布,BootStrap是基于Html,Css,Javascript的,可用于快速开发web,是现在注流的前端框架。Bootstrap的优点有: ...

一、Bootstrap简介

BootStrap是由Twitter推出的前端框架,2011 年八月在 GitHub 上发布,BootStrap是基于Html,Css,Javascript的,可用于快速开发web,是现在注流的前端框架。

Bootstrap的优点有:

      1. 移动设备优先:自 Bootstrap 3 起,框架包含了贯穿于整个库的移动设备优先的样式。

      2.浏览器支持:所有的主流浏览器都支持 Bootstrap。

      3.容易上手:因为Bootstrap是基于 HTML 和 CSS 的基础知识,所以学习使用轻松。

      4.响应式设计:Bootstrap 的响应式 CSS 能够自适应于台式机、平板电脑和手机

二、下载BootStrap

可以从 http://getbootstrap.com/ 上下载 Bootstrap 的最新版本。当您点击这个链接时,将看到如下所示的网页

BootStrap学习

您会看到两个按钮:

  • Download Bootstrap:下载 Bootstrap。点击该按钮,您可以下载 Bootstrap CSS、JavaScript 和字体的预编译的压缩版本。不包含文档和最初的源代码文件。
  • Download Source:下载源代码。点击该按钮,您可以直接从 from 上得到最新的 Bootstrap LESS 和 JavaScript 源代码。这个是包含上面的压缩内容再加上源代码

    我们下载Download Bootstrap 这个就可以了。

   然后这个的文件结构是

BootStrap学习

 已经看到里面是一些CSS 和 JS 还有Glyphicons 的字体。

三、引入到HTML

        1.把下载好的BootStrap文件放到项目中。

       2.一个引用BootStrap的html模板:

     

<!DOCTYPE html><html ="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>  <title></title>  <link href="../js/bootstrap-3.3.5/dist/css/bootstrap.min.css" rel="stylesheet" />  <script src='/images/loading.gif' data-original="../js/jquery-1.9.1.min.js"></script>  <script src='/images/loading.gif' data-original="../js/bootstrap-3.3.5/dist/js/bootstrap.min.js"></script></head><body>  </body></html>

原标题:BootStrap学习

关键词:

*特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们: admin#shaoqun.com (#换成@)。

可能感兴趣文章

我的浏览记录