<!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</title>
    <!-- 最新版本的 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">

    <!-- 可选的 Bootstrap 主题文件（一般不用引入） -->
    <link rel="stylesheet" href="https://cdn.bootcss.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
    <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script>
    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="https://cdn.bootcss.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script>
    <style>
    </style>
</head>
<body>
<h1>我们学习<span class="label label-default">bootstrap</span></h1>
<h2>我们学习<span class="label label-danger">bootstrap</span></h2>
<h3>我们学习<span class="label label-info">bootstrap</span></h3>
<h4>我们学习<span class="label label-warning">bootstrap</span></h4>

<hr/>
<a href="#">消息<span class="badge">5</span></a>
<button type="button">大家好<span class="badge">89</span></button>
<ul class="list-group">
    <li class="list-group-item"><a href="#">大家好</a><span class="badge">45</span></li>
    <li class="list-group-item"><a href="#">大家好</a><span class="badge">45</span></li>
    <li class="list-group-item"><a href="#">大家好</a><span class="badge">45</span></li>
</ul>
<div class="container">
    <div class="page-header">
        <h1>大屏展播，很好用，，<small>小标题</small></h1>
    </div>

    <div class="jumbotron">
        <h1>主要标题</h1>
        <p>这里是想写的文本。。。。。</p>
        <a href="#" class="btn btn-danger btn-lg">阅读更多</a>
    </div>
</div>
</body>
</html>

⑾bootstrap组件 徽章 大屏 页头 基础案例的更多相关文章

  1. ⑿bootstrap组件 缩略图 警告框 进度条 基础案例

      <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&q ...

  2. Bootstrap 学习笔记4 巨幕页头略缩图警告框

  3. 第二百四十节，Bootstrap巨幕页头缩略图和警告框组件

    Bootstrap巨幕页头缩略图和警告框组件 学习要点: 1.巨幕组件 2.页头组件 3.缩略图组件 4.警告框组件 本节课我们主要学习一下 Bootstrap 的四个组件功能:巨幕组件.页头组件.缩 ...

  4. ASP.NET MVC使用Bootstrap系列（3）——使用Bootstrap 组件

    阅读目录 Bootstrap 导航条 列表组 徽章 媒体对象 页头 路径导航 分页 输入框组 按钮式下拉菜单 警告框 进度条 小结 Bootstrap为我们提供了十几种的可复用组件,包括字体图标.下拉 ...

  5. Qt编写数据可视化大屏界面电子看板13-基础版

    一.前言 之前发布的Qt编写的可视化大屏电子看板系统,很多开发者比较感兴趣,也收到了很多反馈意见,纵观市面上的大屏系统,基本上都是B/S结构的web版本,需要在后台进行自定义配置模块,绑定数据源等,其 ...

  6. 一招教你轻松使用数据可视化BI软件创建旅游消费数据可视化大屏

    灯果数据可视化BI软件是新一代人工智能数据可视化大屏软件,内置丰富的大屏模板,可视化编辑操作,无需任何经验就可以创建属于你自己的大屏.大家可以在他们的官网下载软件.   本文以旅游消费数据可视化大屏为 ...

  7. 不会用数据可视化大屏？一招教你轻松使用数据可视化BI软件创建农业公司运营数据分析大屏

    灯果数据可视化BI软件是新一代人工智能数据可视化大屏软件,内置丰富的大屏模板,可视化编辑操作,无需任何经验就可以创建属于你自己的大屏.大家可以在他们的官网下载软件.   本文以农业公司运营数据分析大屏 ...

  8. 干货！手把手教你使用数据可视化BI软件创建企业变更流程监控大屏

    灯果数据可视化BI软件是新一代人工智能数据可视化大屏软件,内置丰富的大屏模板,可视化编辑操作,无需任何经验就可以创建属于你自己的大屏.大家可以在他们的官网下载软件.   本文以企业变更流程监控大屏为例 ...

  9. 手把手教你快速使用数据可视化BI软件创建互联网用户数据分析大屏

    灯果数据可视化BI软件是新一代人工智能数据可视化大屏软件,内置丰富的大屏模板,可视化编辑操作,无需任何经验就可以创建属于你自己的大屏.大家可以在他们的官网下载软件.   本文以互联网用户数据分析大屏为 ...

随机推荐

  1. 每周分享之 二 http协议(2)

    本次分享http协议,共分为三部分,这是第二部分,主要讲解请求与响应的字段,以及状态码. 以http/1.1版本的一个完整的请求与响应作为例子 http请求信息由三部分组成 1.请求方法(GET/PO ...

  2. （转）深度学习word2vec笔记之基础篇

    深度学习word2vec笔记之基础篇 声明: 1)该博文是多位博主以及多位文档资料的主人所无私奉献的论文资料整理的.具体引用的资料请看参考文献.具体的版本声明也参考原文献 2)本文仅供学术交流,非商用 ...

  3. Java历程-初学篇 Day05选择结构(2)

    一,switch 由于本作者学的是jdk6.0版本,我知道7.0可以使用字符串,但是我就不改了 语法: switch(char类型/int类型){ case 值: //输出 break; ... de ...

  4. ASP.NET Core 2.0 支付宝当面付之扫码支付

    前言 自从微软更换了CEO以后,微软的战略方向有了相当大的变化,不再是那么封闭,开源了许多东西,拥抱开源社区,.NET实现跨平台,收购xamarin并免费提供给开发者等等.我本人是很喜欢.net的,并 ...

  5. Python自学笔记-time模块（转）

    在Python中,通常有这几种方式来表示时间:1)时间戳 2)格式化的时间字符串 3)元组(struct_time)共九个元素.由于Python的time模块实现主要调用C库,所以各个平台可能有所不同 ...

  6. c# 接口实用

    学习接口,还是记下来吧,不然以后忘记,这个东西也不是常用. interface Interface1 {  } 接口中不能有字段, 只能声明方法.

  7. DevOps之服务故障

    唠叨话 关于德语噢屁事的知识点,仅提供精华汇总,具体知识点细节,参考教程网址,如需帮助,请留言. <DevOps服务故障> 0.故障1.设施故障2.设备故障3.系统故障4.虚拟化故障5.存 ...

  8. java之基础数据类型学习————（一）

    JAVA数据类型: 总结来说,java的基本数据类型分为 四类八种 • 第一类:整数类型:byte.short.int.long • 第二类:浮点型:float.double • 第三类:字符类型:c ...

  9. 在不用Promise的情况下如何控制异步请求？

    如何更好的控制异步请求?相信大家一定首选Promise对象.确实,使用Promise控制异步请求确实非常方便,直接使用then()方法就可以实现当一个异步请求完成后再处理另一个请求或操作.同时,这样的 ...

  10. 浅谈oracle树状结构层级查询测试数据

    浅谈oracle树状结构层级查询 oracle树状结构查询即层次递归查询,是sql语句经常用到的,在实际开发中组织结构实现及其层次化实现功能也是经常遇到的,虽然我是一个java程序开发者,我一直觉得只 ...