在这里记录一下搭建Bootstrap的开发环境:

首先手头上的有Bootstrap的相关资料,这里用的是bootstrap-3.3.5-dist。

在开发一个Web项目的时候要将述的资料都导入到项目中。
然后还要添加引用:

主要有5点需要注意一下:

1. 添加Bootstrap的全局css文件;
2. 添加jQuery的js文件引用(先于Bootstrap的js文件引入之前);
3. 添加Bootstrap的js文件引用;
4. 标明是html5;
5. 添加对应的meta标签。

可以愉快地使用bootstrap了!

P.S.

后来发现在使用class="form-control"的时候,并没有出现该有的样式,而是

然后检查半天,居然是这里没有加(红框框里里面的):

加了之后的效果是:

Bootstrap使用初涉的更多相关文章

  1. 旺财速啃H5框架之Bootstrap(五)

    在上一篇<<旺财速啃H5框架之Bootstrap(四)>>做了基本的框架,<<旺财速啃H5框架之Bootstrap(二)>>篇里也大体认识了bootst ...

  2. 旺财速啃H5框架之Bootstrap(四)

    上一篇<<旺财速啃H5框架之Bootstrap(三)>>已经把导航做了,接下来搭建内容框架.... 对于不规整的网页,要做成自适应就有点玩大了.... 例如下面这种版式的页面. ...

  3. bootstrap + requireJS+ director+ knockout + web API = 一个时髦的单页程序

    也许单页程序(Single Page Application)并不是什么时髦的玩意,像Gmail在很早之前就已经在使用这种模式.通常的说法是它通过避免页面刷新大大提高了网站的响应性,像操作桌面应用程序 ...

  4. 参考bootstrap中的popover.js的css画消息弹框

    前段时间小颖的大学同学给小颖发了一张截图,图片类似下面这张图: 小颖当时大概的给她说了下,其实小颖也不知道上面那个三角形怎么画嘻嘻,给她说了DOM结构,具体的css让她自己百度,今天小颖自己参考boo ...

  5. Bootstrap 模态框(Modal)插件

    页面效果: html+js: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...

  6. 利用bootstrap的carousel.js实现轮播图动画

    前期准备: 1.jquery.js. 2.bootstrap的carousel.js. 3.bootstrap.css. 如果大家不知道在哪下载,可以联系小颖,小颖把这些js和css可以发送给你. 一 ...

  7. 旺财速啃H5框架之Bootstrap(三)

    好多天没有写了,继续走起 在上一篇<<旺财速啃H5框架之Bootstrap(二)>>中已经把CSS引入到页面中,接下来开始写页面. 首先有些问题要先处理了,问什么你要学boot ...

  8. 旺财速啃H5框架之Bootstrap(二)

    突然感觉不知道写啥子,脑子里面没水了,可能是因为今晚要出去浪,哈哈~~~提前提醒大家平安夜要回家哦,圣诞节生00000000000这么多蛋....继续 上一篇的已经把bootstrap了解个大概了,接 ...

  9. 旺财速啃H5框架之Bootstrap(一)

    接下来的时间里,我将和大家一起对当前非常流行的前端框架Bootstrap进行速度的学习,以案例的形式.对刚开始想学习Bootstrap的同学而找不着边的就很有帮助了.如果你想详细的学习Bootstra ...

随机推荐

  1. Ajax跨域的几种方法以及每种方法的原理

    js中几种实用的跨域方法原理详解 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同域的框架中(iframe)的数据.只要协 ...

  2. js基础练习二之简易日历

    今天学到了js基础教程3,昨天的课后练习还没来的及做,这个是类似简易日历的小案例,视频还没听完,今晚继续...... 先看效果图: 其实做过前面的Tab选项卡,这个就很好理解了,通过鼠标放在不同月份月 ...

  3. [MacOS] 终端使用ssh时,中文乱码问题处理

    终端显示中文问题处理: vim ~/.inputrc 加入以下代码 set meta-flag on set convert-meta off set input-meta on set output ...

  4. UI,切图,命名

    APP切图流程和APP切图命名规范详细完整版 http://www.25xt.com/appdesign/7339.html Marketch

  5. python利用redis构成一个队列

    例子在 http://peter-hoffmann.com/2012/python-simple-queue-redis-queue.html 英文 http://www.django-china.c ...

  6. 分布式入门之2:Quorum机制

    1.  全写读1(write all, read one) 全写读1是最直观的副本控制规则.写时,只有全部副本写成功,才算是写成功.这样,读取时只需要从其中一个副本上读数据,就能保证正确性. 这种规则 ...

  7. 走进spring之springmvc实战篇(一)

    本篇运用springmvc来试着写一个登录注册页面 在动手之前,我们需要了解下springnvc.这里先献上一张springmvc的流程图及讲解. Spring的MVC框架是一个基于Dispatche ...

  8. DataGrid新增行数据

    本文将介绍一下,如何通过Jquery MiniUI来添加Datagrid一行. 1.效果展示: ↓ 2.具体代码: <script type="text/javascript" ...

  9. 深度系统deepin使用初体验

    最近使用linux系统比较多,因为很多项目要用到,而且厌烦了windows流氓软件各种广告的繁琐,因此决定在自己的本子上安装linux系统.然后了解到了deepin操作系统,竟然是武汉一个公司发行的版 ...

  10. Bootstrap栅格系统详解,响应式布局

    Bootstrap栅格系统详解 栅格系统介绍 Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统,随着屏幕或视口(viewport)尺寸的增加,系统会自动分为最多12列. 栅格系统用于通 ...