Well 是一种会引起内容凹陷显示或插图效果的容器 <div>。为了创建 Well，只需要简单地把内容放在带有 class .well 的 <div> 中即可。下面的实例演示了一个默认的 Well：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Bootstrap历练实例：默认的Well</title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css" />
</head>
<body>
<div style="padding:20px">
<div class="well">
Hello、 bootstrap、 我在Well中。
</div>
</div>

<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap历练实例：默认的Well的更多相关文章

  1. Bootstrap历练实例：默认的媒体对象

    Bootstrap 多媒体对象(Media Object) 本章我们将讲解 Bootstrap 中的多媒体对象(Media Object).这些抽象的对象样式用于创建各种类型的组件(比如:博客评论), ...

  2. Bootstrap历练实例：默认的列表组

    Bootstrap 列表组 本章我们将讲解列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-grou ...

  3. Bootstrap历练实例：默认的面板(Panels)

    Bootstrap 面板(Panels) 本章将讲解 Bootstrap 面板(Panels).面板组件用于把 DOM 组件插入到一个盒子中.创建一个基本的面板,只需要向 <div> 元素 ...

  4. Bootstrap历练实例：默认的进度条

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

  5. Bootstrap历练实例：默认的缩略图

    本章将讲解Bootstrap缩略图,大多数站点都需要要在网格中布局图像,视频,文本.Bootstrap通过缩略图为此提供了一些简便的方法,使用Bootstrap创建缩略图的步骤如下: 1.在图像的周围 ...

  6. Bootstrap历练实例：禁用的按钮

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  7. Bootstrap历练实例：点击激活的按钮

    <!DOCTYPE html><html><head> <meta http-equiv="Content-Type" content=& ...

  8. Bootstrap历练实例：表单控件大小

    表单控件大小 您可以分别使用 class .input-lg 和 .col-lg-* 来设置表单的高度和宽度. 实例: <!DOCTYPE html><html><hea ...

  9. Bootstrap历练实例：轮播(carousel)

    <!DOCTYPE html><html><head><meta http-equiv="Content-Type" content=&q ...

随机推荐

  1. 3dmax tcb控制器

    https://wenku.baidu.com/video/course/v/3a0e059d884c4d0b03bf85441b87311b 7.48开始 tcb控制器比较适合产生平滑动画 张力Te ...

  2. Unity surface shader 2

    UV滚动 Shader "Nafio/ScrollUV" { Properties { _Tex("T",2D) = "white" {} ...

  3. symbol lookup error: /lib64/libpango-1.0.so.0: undefined symbol: g_log_structured_standard 错误

    通过更新glib2包修复.(yum update glib2)即可 拿走不谢,我也找得好辛苦!!!

  4. 如何使用sass

    Sass 是对 CSS 的扩展,让 CSS 语言更强大.优雅. 它允许你使用变量.嵌套规则.mixin.导入等众多功能, 并且完全兼容 CSS 语法. Sass 有助于保持大型样式表结构良好, 同时也 ...

  5. 题解 BZOJ 1912 && luogu P3629 [APIO2010]巡逻 （树的直径）

    本来抄了篇题解,后来觉得题解都太不友好(我太菜了),一气之下自己打...一打打到第二天QAQ 首先什么边也不加时,总路程就是2*(n-1) 考虑k=1的时候,答案显然是2*(n-1)-直径+1=2*n ...

  6. c++11 thread的学习

    http://www.cnblogs.com/wxquare/p/6736202.html 还没开始 留个链接 使用c++11 thread支持实现  一个生产者消费者模型 下面是一个生产者消费者问题 ...

  7. list 转换成datatable

    感谢网上的一位朋友 /// <summary> /// 将集合类转换成DataTable /// </summary> /// <param name="lis ...

  8. spring data jpa自定义baseRepository

    在一些特殊时候,我们会设计到对Spring Data JPA中的方法进行重新实现,这将会面临一个问题,如果我们新创建一个实现类.如果这个实现类实现了JpaRepository接口,这样我们不得不实现该 ...

  9. 关于Servlet中的转发和重定项

    一:转发 首先转发属于服务器内部行为,通过浏览器的地址栏是看不到URL变化的.比如说客户端发送一个请求到ServletA,ServletA接收到请求,但是没有能力处理,但是ServletA知道Serv ...

  10. js获取当前的年月日时分秒周期

    function timeNow(){ var date = new Date(); this.year = date.getFullYear(); this.month = date.getMont ...