对于移动端,能够快速搭建网站,操作相对简单 ,更容易掌握,这篇文章就介绍一下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. 5、Python 基础类型 -- Dictionary 字典类型

    字典是另一种可变容器模型,且可存储任意类型对象. 字典的每个键值 key=>value 对用冒号 : 分割,每个键值对之间用逗号 , 分割,整个字典包括在花括号 {} 中 ,格式如下所示: d ...

  2. OVR工厂简介

    最近在写分布式架构的应用,顺便写了一个轻量级的集群批量创建影像金字塔的软件,在遥感影像生产中能提升不少效率.以下是软件简介: 由于32位ArcGIS在批量创建影像金字塔中计算力不足和易中断的缺点,在创 ...

  3. js实现复制|剪切指定内容到粘贴板--clipboard

    这是著名开源项目 clipboard.js 的 README.md,里面讲解的更加详细,有兴趣的同学可以了解一下.项目地址:https://github.com/zenorocha/clipboard ...

  4. 小程序之rpx适配方案

    官网文档: 我的理解: rpx是自适应单位 计算方式: 1rpx = 设备屏幕宽度 / 750 注意:750是官网规定 为什么选择iPhone6为标准,作为开发模拟? 因为在iPhone6中,1px ...

  5. springBoot和MyBatis整合中出现SpringBoot无法启动时处理方式

    在springBoot和Myatis   整合中出现springBoot无法启动   并且报以下错误 Description: Field userMapper in cn.lijun.control ...

  6. Attribute 实现Aop

    1.先定义一个 拦截属性 AopAttribute using System; using System.Collections.Generic; using System.Linq; using S ...

  7. Golang flag包使用详解(一)

    概述 flag包提供了一系列解析命令行参数的功能接口 命令行语法 命令行语法主要有以下几种形式 -flag //只支持bool类型 -flag=x -flag x //只支持非bool类型 以上语法对 ...

  8. ASP.NET Core学习——1

    ASP.NET Core介绍 ASP.NET Core是一个新的开源和跨平台的框架,用于构建如Web应用.物联网(IoT)应用和移动后端应用等连接到互联网的基于云的现代应用程序.ASP.NET Cor ...

  9. 使用并行ssh提高工作效率

    我们经常需要ssh到多个主机上执行相同的命令,为了提高效率,我们通常会自己写个脚本,循环遍历执行我们的命令,比如: for host in `cat hosts.txt`;do ssh usernam ...

  10. JAVA 字符串索引

    String类的substring()方法   截取字符串,在java语言中的用法 1.  public String substring(int beginIndex) 返回一个新字符串,它是此字符 ...