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. 【Splay】【启发式合并】hdu6133 Army Formations

    题意:给你一颗树,每个结点的儿子数不超过2.每个结点有一个权值,一个结点的代价被定义为将其子树中所有结点的权值放入数组排序后,每个权值乘以其下标的和.让你计算所有结点的代价. 二叉树的条件没有用到. ...

  2. 20162312Java结对编程之挑战出题

    需求分析 实现去重出题,并以命令行参数形式指定题目要求. 设计思路 具体的思路: 思路一: 原本我和春旺商量通过集合中的元素的不重复性进行去重.但是运算符多也导致重复的数字多,去重的数量也大大增多越到 ...

  3. java乱码问题总结

    在基于Java的编程中,经常会碰到汉字的处里及显示的问题,比如一大堆乱码或问号. 这是因为JAVA中默认的编码方式是UNICODE,而中国人通常使用的文件和DB都是基于GB2312或者BIG5等编码, ...

  4. 装载 | Eclipse中搭建最新版本的Android开发环境

    文章目录 准备工作 下载文件 下载JDK并配置系统变量环境 下载安装Eclipse 下载Android SDK 下载ADT插件 使用下载好的软件搭建Android开发环境 安装Android的SDK ...

  5. [转]Web.xml配置详解之context-param

    转自:http://blog.csdn.net/liaoxiaohua1981/article/details/6759206 格式定义: [html] view plaincopy   <co ...

  6. golang slice 切片原理

    golang 中的 slice 非常强大,让数组操作非常方便高效.在开发中不定长度表示的数组全部都是 slice .但是很多同学对 slice 的模糊认识,造成认为golang中的数组是引用类型,结果 ...

  7. Red Hat Enterprise Linux上配置SQL Server Always On Availability Group

    http://www.cnblogs.com/lavender000/p/6946848.html

  8. 启用 Jenkins 持续构建 .NET 程序,关于配置nuget关键点

    网上关于 Jenkins + net 的文章一大堆,这里只贴出 配置中的关键点, 第一步: 从官网下载 nuget.exe 安装包进行安装, 如果项目是用 vs2017 开发的 需要特别注意,nuge ...

  9. 花间美人:古风 CG插画技法

    <花间美人:古风 CG插画技法> 基本信息 作者: 猫君大白    出版社:机械工业出版社 ISBN:9787111429432 上架时间:2013-7-3 出版日期:2013 年7月 开 ...

  10. scrapy爬虫框架实例一,爬取自己博客

    本篇就是利用scrapy框架来抓取本人的博客,博客地址:http://www.cnblogs.com/shaosks scrapy框架是个比较简单易用基于python的爬虫框架,相关文档:http:/ ...