一、什么是Bootstrap

　　bootstrap是一款css框架，便于响应式设计。

二、怎样使用bootstarp

　　最常用的方法，在html结构中引入样式表bootstarp.min.css，以及jq和bootstrap jq 库 bootstarp.min.js

　　以下是bootstarp 的基本html模板：

 <!DOCTYPE html>

 <html lang="en">

     <head>

         <meta charset="utf-8">

         <meta http-equiv="X-UA-Compatible" content="IE=edge">

         <meta name="viewport" content="width=device-width, initial-scale=1">

         <title>Bootstrap的HTML标准模板</title>

         <!-- Bootstrap -->

         <link href="css/bootstrap.min.css" rel="stylesheet">

         <!--你自己的样式文件 -->

         <link href="css/your-style.css" rel="stylesheet">

     </head>

     <body>

         <h1>Hello, world!</h1>

         <!-- 如果要使用Bootstrap的js插件，必须先调入jQuery -->

         <script src="http://libs.baidu.com/jquery/1.9.0/jquery.min.js"></script>

         <!-- 包括所有bootstrap的js插件或者可以根据需要使用的js插件调用　-->

         <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>

     </body>

 </html>

注：一般来说，需要把css文件放在<head>中，jq与js放在boot的最下面

Bootstrap学习笔记（一）的更多相关文章

  1. Bootstrap~学习笔记索引

    回到占占推荐博客索引 bootstrap已经用了有段时间了,感觉在使用上还是比较容易接受的,在开发人员用起来上,也还好,不用考虑它的兼容性,手机,平台,PC都可以有效的兼容. bootstrap官方a ...

  2. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  3. bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http://www.imooc.com/code/3120

    为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...

  4. bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111

    基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...

  5. Bootstrap学习笔记-布局

    Bootstrap学习笔记-布局 默认是响应式布局,就是你在改变页面的时候也不会出现乱的现象. <html><head> <meta charset="utf- ...

  6. Bootstrap学习笔记博客

    本片博客用于记录之后要用到Bootstrap的学习笔记   概括: Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASC ...

  7. bootstrap学习笔记--bootstrap安装环境

    Bootstrap 安装是非常容易的.此文是本人的学习汇总,便于以后查询学习,同时也希望给大家带来帮助. 下载 Bootstrap 您可以从 http://getbootstrap.com/ 上下载 ...

  8. Bootstrap学习笔记系列1-------Bootstrap网格系统

    Bootstrap网格系统 学习笔记 [TOC] 简单网格 先上代码再解释 <!DOCTYPE html> <html> <head> <title>B ...

  9. bootstrap 学习笔记（1）---介绍bootstrap和栅格系统

    学习前端许久,对于布置框架和响应浏览器用html 和javascript 写的有点繁琐,无意间看到这个框架,觉得挺好用的就开始学习了,但是这个框架上面有很多知识,不是所有的都要学的,故将学习笔记和觉得 ...

  10. bootstrap 学习笔记

    bootstrap作为当下的流行框架不知道它怎么能行呢? 之前也看过好多bootstrap的网上教程,可是发现光看真的记不住,说起来也真是忧桑~重点还是要自己做才是真正的印象深刻.后来我发现解析模板是 ...

随机推荐

  1. Servlet 工程 web.xml 中的 servlet 和 servlet-mapping 标签

    本文转载自 陈蒙的博客 最近在学习JavaEE轻量级框架,对于servlet-mapping中的url-partten标签以及网页访问时的执行顺序不是很清楚,搜索了很多遍终于找到了这篇博文(搜索也是个 ...

  2. [转] - Configuring Android Studio: IDE & VM Options, JDK, etc

    Configuring Android Studio: IDE & VM Options, JDK, etc You should not edit any files in the IDE ...

  3. ArcGIS影像配准与空间配准

    ArcGIS影像配准与空间配准 ArcGIS影像配准与空间配准 地图配准可分为影像配准和空间配准.影像配准的对象是raster图,譬如TIFF图.配准后的图可以保存为ESRI GRID, TIFF,或 ...

  4. 关于近期项目代码整理(iOS)

    近期对项目中所经常使用到的封装代码进行整理,并将其上传至网络保存,本人会在后期不间断的更新其内容.具体链接地址为代码封装 关于代码 这些代码为从学习iOS来到现在实际项目开发中,精炼出来的封装代码,使 ...

  5. springMVC下jsp引用外部js,css等静态资源的解决方法

    直入主题. 1. web.xml对springMVC配置如下: <servlet> <description>Spring MVC配置</description> ...

  6. 三代PacBio reads纠错 - 专题

    三代纠错的重要性不言而喻,三代的核心优势就是长,唯一的缺点就是错误率高,但好就好在错误是随机分布的,可以通过算法解决,这也就是为什么现在有这么多针对三代开发的纠错工具. 纠错和组装是分不开的,纠错就是 ...

  7. IntelliJ IDEA中Maven项目的默认JDK版本

    在IntelliJ IDEA 15中使用Maven时,IDEA将默认的编译版本.源码版本设置为jdk5.编译项目的时候出现警告:"Warning:Java: 源值1.5已过时, 将在未来所有 ...

  8. HashSet和HashMap的区别

    HashSet和HashMap的区别.Java的HashSet类是由哈希表支持.它不保证 set 的迭代顺序:特别是它不保证该顺序恒久不变.此类允许使用 null 元素.HashSet类为基本操作提供 ...

  9. Java_Swing程序设计_尝试开发一个登陆窗体，包括用户名、密码以及提交按钮和重置按钮，当用户输入用户名my，密码love时，弹出登陆成功提示对话框。

    package com.lzw; import java.awt.*;import java.awt.event.*; import javax.swing.*; public class UseCa ...

  10. ubuntu静态DNS配置，重启继续生效

    搞linux上网是件很闹心的事情,更有些闹心的在于毛线DNS在重启之后就木有了,写在/etc/resolv.conf文件中的,后来发现在文件中丫是这样写的: # Dynamic resolv.conf ...