对于移动端，能够快速搭建网站，操作相对简单 ，更容易掌握，这篇文章就介绍一下BootStrap

一  什么是Bottstrap

一个前端开发的框架，Bootstrap，来自 Twitter，是目前很受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JavaScript 的，它简洁灵活，使得 Web 开发更加快捷

二 使用Bootstrap好处

1. 定义了很多的css样式和js插件。我们开发人员直接可以使用这些样式和插件得到丰富的页面效果。
    2. 响应式布局。
*       同一套页面可以兼容不同分辨率的设备。

三、快速入门

　　　　1. 下载用于生产环境的Bootstrap

              2. 在项目中将这三个文件夹复制

             3. 创建html页面，引入必要的资源文件

代码如下：

     

<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
<title>Bootstrap HelloWorld</title>

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

<!-- jQuery (Bootstrap 的所有 JavaScript 插件都依赖 jQuery，所以必须放在前边) -->
<script src="js/jquery-3.2.1.min.js"></script>
<!-- 加载 Bootstrap 的所有 JavaScript 插件。你也可以根据需要只加载单个插件。 -->
<script src="js/bootstrap.min.js"></script>
</head>
<body>
<h1>你好，Bootstrap的世界！</h1>

</body>
</html>

Bootstrap快速入门并且建立常用模板的更多相关文章

  1. Bootstrap快速入门

    Bootstrap有两个重点,一个是概念的理解,理解bootstrap是如何通过div来代替过去的table布局的:一个是常用结构的熟悉,做到需要的组件马上就能找到,小修修改改可用就行.其最帅的一点就 ...

  2. [PowerShell] 快速入门, 基本语法, 常用类型, 函数, .NET 互操作

    PowerShell 快速入门 开始之前, 我们认定你已经有一定的编程基础, 熟悉 .NET 中的类型与对象. 此文章对于 .NET 开发者来说更简单哦! 在 PowerShell 中, 几乎一切都是 ...

  3. bootstrap快速入门笔记（四）-less用法指南， mixin和变量

    一,less变量,less文件 1.bootstrap.less 这是主要的 Less 文件.该文件中导入了一些其他的 less 文件.该文件中没有任何代码. 2.forms.less 这个 Less ...

  4. jQuery UI 之 Bootstrap 快速入门

    转载自(http://www.shouce.ren/example/show/s/6444) 1. 下载 这个页面是用来展示 jQuery UI Bootstrap 项目的 -- 我们将 Bootst ...

  5. bootstrap快速入门笔记（九）-响应式工具

    一,可用的类   超小屏幕手机 (<768px) 小屏幕平板 (≥768px) 中等屏幕桌面 (≥992px) 大屏幕桌面 (≥1200px) .visible-xs-* 可见 隐藏 隐藏 隐藏 ...

  6. bootstrap快速入门笔记（八）-按钮，响应式图片

    一,默认样式:.btn-default , .btn-primary , .btn-success  ,.btn-info, btn-warning ,btn-link 二,尺寸:.btn-lg, . ...

  7. bootstrap快速入门笔记（七）-表格,表单

    一,表格 1,<table>中加.table类 2,条纹表格:通过 .table-striped 类可以给 <tbody> 之内的每一行增加斑马条纹样式. **跨浏览器兼容性: ...

  8. bootstrap快速入门笔记（二）-栅格系统，响应式类

    一,栅格系统大致有以下: 1,行row必须包含在 .container (固定宽度)或 .container-fluid (100% 宽度)中,一行有12列 2.“列(column)”在水平方向创建一 ...

  9. bootstrap快速入门笔记（一）

    一,头部基本格式:<head lang="en"> <meta charset="UTF-8"> <meta name=" ...

随机推荐

  1. windows API 第22篇 WTSGetActiveConsoleSessionId

    函数原型:DWORD WTSGetActiveConsoleSessionId (VOID)先看一下原文介绍: The WTSGetActiveConsoleSessionId function re ...

  2. codeforces round 433 C. Planning 贪心

    题目大意: 输入n,k,代表n列航班,初始始发实践为1,2,3分钟以此类推,然后输入n个整数分别代表延迟1分钟第i个航班损失多少钱,然后调整后的始发时间表是这样的,任何一辆航班的始发时间不能在他的初始 ...

  3. Atcoder arc093

    D-Grid Components 在一个100*100的网格图上染色,问黑格四连通块的个数为A,白格四连通块的个数为B的一种构造方案?(A,B<=500) 将整个平面分成50*100的两部分, ...

  4. qt中使用sqlite存储数据

    一.sqilte的安装 在Windows上安装SQLite: 请访问 SQLite 下载页面,从 Windows 区下载预编译的二进制文件. 您需要下载 sqlite-tools-win32-*.zi ...

  5. Shiro学习（23）多项目集中权限管理

    在做一些企业内部项目时或一些互联网后台时:可能会涉及到集中权限管理,统一进行多项目的权限管理:另外也需要统一的会话管理,即实现单点身份认证和授权控制. 学习本章之前,请务必先学习<第十章 会话管 ...

  6. 关于Kerberos协议流程的总结

    Kerberos协议工作原理分析 这里面借用一下师傅们的图来说明一下    Kerberos协议的流程大致如下(假设A要获取对Server B的访问权限) 第一步(KRB_AS_REQ) 这一步客户 ...

  7. docker仓库管理(9)

    使用公共 Registry Docker Hub 是 Docker 公司维护的公共 Registry.用户可以将自己的镜像保存到 Docker Hub 免费的 repository 中.如果不希望别人 ...

  8. php获取网页源码分行显示

    file(PHP 3, PHP 4 )file -- 把整个文件读入一个数组中说明:file ( string filename [, int use_include_path [, resource ...

  9. Sqli labs系列-less-2 详细篇

    就今天晚上一个小插曲,瞬间感觉我被嘲讽了. SQL手工注入这个东西,杂说了吧,如果你好久不玩的话,一时说开了,你也只能讲个大概,有时候,长期不写写,你的构造语句还非常容易忘,要不我杂会被瞬间嘲讽了啊. ...

  10. codeforces 447E or 446C 线段树 + fib性质或二次剩余性质

    CF446C题意: 给你一个数列\(a_i\),有两种操作:区间求和:\(\sum_{i=l}^{r}(a[i]+=fib[i-l+1])\).\(fib\)是斐波那契数列. 思路 (一) codef ...