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

html:

<div>
<div class="well">
well测试
</div>
</div>

尺寸大小

您可以使用可选类well-lg 或well-sm来改变Well的尺寸大小。这两个类是与.well类结合使用的。这两个糊糊会影响内边距padding,根据使用的类,Well会显示得更大或更小。

代码:

<h2>Well</h2>
<div class="well well-lg">
在大的Well中
</div>
<div class="well">
在一般的Well中
</div>
<div class="well well-sm">
在小的的Well中
</div>

本节完..

Bootstrap学习笔记 Well的更多相关文章

  1. Bootstrap~学习笔记索引

    回到占占推荐博客索引 bootstrap已经用了有段时间了,感觉在使用上还是比较容易接受的,在开发人员用起来上,也还好,不用考虑它的兼容性,手机,平台,PC都可以有效的兼容. bootstrap官方a ...

  2. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  3. bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http://www.imooc.com/code/3120

    为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...

  4. bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111

    基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...

  5. Bootstrap学习笔记-布局

    Bootstrap学习笔记-布局 默认是响应式布局,就是你在改变页面的时候也不会出现乱的现象. <html><head> <meta charset="utf- ...

  6. Bootstrap学习笔记博客

    本片博客用于记录之后要用到Bootstrap的学习笔记   概括: Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASC ...

  7. bootstrap学习笔记--bootstrap安装环境

    Bootstrap 安装是非常容易的.此文是本人的学习汇总,便于以后查询学习,同时也希望给大家带来帮助. 下载 Bootstrap 您可以从 http://getbootstrap.com/ 上下载 ...

  8. Bootstrap学习笔记系列1-------Bootstrap网格系统

    Bootstrap网格系统 学习笔记 [TOC] 简单网格 先上代码再解释 <!DOCTYPE html> <html> <head> <title>B ...

  9. bootstrap 学习笔记(1)---介绍bootstrap和栅格系统

    学习前端许久,对于布置框架和响应浏览器用html 和javascript 写的有点繁琐,无意间看到这个框架,觉得挺好用的就开始学习了,但是这个框架上面有很多知识,不是所有的都要学的,故将学习笔记和觉得 ...

  10. bootstrap 学习笔记

    bootstrap作为当下的流行框架不知道它怎么能行呢? 之前也看过好多bootstrap的网上教程,可是发现光看真的记不住,说起来也真是忧桑~重点还是要自己做才是真正的印象深刻.后来我发现解析模板是 ...

随机推荐

  1. HDU 6040 Hints of sd0061(nth_element)

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=6040 [题目大意] 给出一个随机数生成器,有m个询问,问第bi小的元素是啥 询问中对于bi< ...

  2. [SRM568]DisjointSemicircles

    题意:$2n$个位置排成一列,有一些位置已经填了数字($0\cdots n-1$中每个数字出现$0$次或$2$次),问是否存在一种填数方案使得用$n$个不相交的半圆可以把相同的数字连起来 首先把所有已 ...

  3. [BZOJ4304]/[JZOJ3486]道路改建

    题目大意: 给你一个有向图,你可以把其中某一条单向边改成双向边,使得图中最大的SCC最大. 问SCC最大能是多少,有哪些方案? 思路: 对原图缩点后就变成了一个DAG. 我们在DAG上DP,记录一下从 ...

  4. Unity3D 粒子系统

    我们先来看看Particle System在Inspector视窗中的属性: 1.Transform:可以控制粒子在世界或者本地坐标的改变.但是有点注意的是,如果你改变Scale属性值是不会影响粒子的 ...

  5. CentOS 6.9关闭NetworkManager服务

    说明:安装了图形界面init5级别的系统会自动安装NetworkManager进行网络管理.这东西有点难搞,所以可以把它禁掉. 配置: #停止NetworkManager service Networ ...

  6. [网络安全]NTP反射型DDOS攻击PPT

    给运维小组培训的NTP反射型DDOS攻击的PPT

  7. enum don't allocate any memory

    int main() { _asm{ mov edi,edi mov edi,edi } ,Green,Yellow}; _asm{ mov edi,edi mov edi,edi } Color c ...

  8. 【shiro】使用shiro,点击页面请求总是302状态码

    解决方法: 配置shiro中,将要求放过的地址后面加上后缀,这里是.htmls 因为web.xml中配置所有的页面都是放过的

  9. 关于V1.6.0版本的项目总结

    10月28号,我们开了1.6项目的总结大会,包括Ting总在内,前端.后台.运维都来参加总结大会了.虽然目标基本达成,但同时也暴露出很多问题,我们希望各方能够坐下来总结一下自己或者各个相关团队的功过是 ...

  10. Android权限操作之uses-permission详解

    本文实例讲述了Android权限操作之uses-permission.分享给大家供大家参考,具体如下: 我们在安装Android软件的时候,系统会提示该软件所需要的权限,相对于其他系统,android ...