一.Bootstrap简介:

Bootstrap 是最受欢迎的 HTML、CSS 和 JS 框架,用于开发响应式布局、移动设备优先的 WEB 项目。

详细参考内容:Bootstrap_v3

二.Bootstrap安装:

 下载地址:https://v3.bootcss.com/(使用v3版,不要使用最新版)

 使用方法一:
下载后解压文件bootstrap-3.3.7-dist

这里有一些多余的文件需要删除,方便我们今后更快的找到导入的框架文件,里面三个文件夹分别留这些就行了:

将bootstrap-3.3.7-dist文件夹复制到项目目录下,就可以导入css文件和js文件来使用bootstrap框架的了,这是本地导入方法。

方法二:https://www.bootcdn.cn/在线导入

导入版本:3.4.1

<link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet"> 

<script src="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/js/bootstrap.min.js"></script>

三、关于Bootstrap的使用,具体可以参考Bootstrap3中文文档,使用大致过程就是:

根据目录找样式>>复制HTML代码>>粘贴HTML代码到自己的HTML文件中>>修改里面的文本和相关参数。

所以使用Bootstrap,可以先熟悉一遍其文档,这样找起来也更迅速、高效。

补充:

Bootstrap自带图标不够丰富,推荐个图标网:http://www.fontawesome.com.cn/,下载后导入就可以了。

HTML、CSS 和 JS框架之Bootstrap的更多相关文章

  1. JS框架_(Bootstrap.js)实现简单的轮播图

    Bootstrap框架中 轮播(Carousel)插件是一种灵活的响应式的向站点添加滑块的方式 轮播图效果: <!DOCTYPE html> <html> <head&g ...

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

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

  3. H5框架之Bootstrap(一)

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

  4. 前端(三大框架、Bootstrap,jQuery,自整理)

    前端,HTML(超文本标记语言),CSS(层叠样式表)和JavaScript(脚本语言) HTML,通常说的h5,其实按标准来说,HTML4的后续版本不带编号了,并保证向前的兼容性 CSS的版本3,增 ...

  5. html css js 框架

    html css js 框架 Bootstrap http://www.bootcss.com/ http://www.cnblogs.com/aehyok/p/3404867.html        ...

  6. CSS 框架之 Bootstrap 的下载和安装

    BootStrap 简介: Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的. 响应式设计:Bootst ...

  7. CI框架下CSS和JS的路径问题

    注意:CI框架下的CSS和JS的引用必须放在框架外面,比如,可建立resource文件夹与application同级,用来封装CSS和JS. 在view层用resource里面CSS和JS可采用以下几 ...

  8. Bootstrap配套的js框架

    求几个搭配bootstrap的js框架.实现如表单验证,文件多传下载等等 Bootstrap File Input文件选择控件: PNotify通知插件: ClockPicker时间拾取器: Boot ...

  9. php ci框架中载入css和js文件失败的原因及解决方法

    在将html页面整合到ci框架里面的时候,载入css和js失败. 原因是ci框架是入口的框架 对框架中文件的全部请求都须要经过index.php处理完毕,当载入外部的css和js文件的时候要使 用ba ...

随机推荐

  1. gcc降版本方法 - [学习]

    [转载]转载时请以超链接形式标明文章原始出处和作者信息及本声明http://www.blogbus.com/huangw10-logs/182474992.html 周末折腾了一下午加一夜,终于弄明白 ...

  2. 分层图初探 By cellur925

    因为最近测试遇到了分层图的题目,所以稍微学了一下==. 这种题目一般是来解决最短路边权有变化/有k条免费路的问题的.他们基本都一般有两种实现方式:dp+最短路/分层图+最短路 当然你如果非要说他们是一 ...

  3. deque双向队列

    对于双向队列,与队列queue以及vector容器的区别就在于,名字不同,也就是它是双向的,可以从头开始操作,也可以从末尾开始操作. 双向队列的常用方法跟队列queue差不多: 头文件: #inclu ...

  4. 简单实现人工智能:百度aip+tuling123

    目录结构: app.py # -*- coding: utf-8 -*- # __author: ward # data: 2018/12/21 # @File: app from flask imp ...

  5. AtCoder Grand Contest 010 F - Tree Game

    题目传送门:https://agc010.contest.atcoder.jp/tasks/agc010_f 题目大意: 给定一棵树,每个节点上有\(a_i\)个石子,某个节点上有一个棋子,两人轮流操 ...

  6. 数据库sql 使用 lag 和OVER 函数和 like 使用 小技巧

    1. sample 1: Lag()就是取当前顺序的上一行记录.结合over就是分组统计数据的.Lag()函数,就是去上N行的字段的数据. SQL> select * from x; A---- ...

  7. python_面向对象进阶(7)

    第1章 面向对象特性—继承(补充) 1.1 接口类.抽象类介绍 1.2 接口类 1.3 接口类应用过程 1.3.1 第一版:完成多种支付方式接口 1.3.2 第二版: 归一化设计,统一支付方式 1.3 ...

  8. WEB前端学习有用的书籍

    WEB前端研发工程师,在国内算是一个朝阳职业,这个领域没有学校的正规教育,大多数人都是靠自己自学成才.本文主要介绍自己从事web开发以来(从大二至今)看过的书籍和自己的成长过程,目的是给想了解Java ...

  9. Arduino Ethernet W5100扩展板的指示灯含义

    Arduino Ethernet W5100扩展板是继承WIZnet W5100网络芯片的扩展板.将扩展板连接到Arduino后,可使Arduino具有网络功能.此扩展板上有多个指示灯,由于轻易查不到 ...

  10. 开发原生安卓cordova插件(有原生界面)

    上文开发的插件没有调用原生界面,本文介绍开发带有activity的插件 本文很多操作与上文重复,重复部分会省略 首先打开plug1,先开发插件的原生代码 在以下命名空间创建一个activity 名称为 ...