Bootstrap，来自 Twitter，是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的，它简洁灵活，使得 Web 开发更加快捷。
缩略图组件
缩略图在网站中最常用的就是产品列表页面，一行显示几张图片，有的在图片底下带有标题、描述内容、按钮等信息。
bootstrap框架将这部分独立成一个模块组件，通过类名.thumbnail配合bootstrap的网格系统来实现。下面是bootstrap缩略图组件不同版本的源码文件：
LESS : tbumbnails.less
SASS : _tbumbnails.scss
实现原理：
布局的实现主要依靠于bootstrap框架的网格系统，下面是缩略图对应的样式
.thumbnail {display: block;padding: 4px;margin-bottom: 20px;line-height: 1.42857143;background-color: #fff;border: 1px solid #ddd;border-radius: 4px;-webkit-transition: all .2s ease-in-out;transition: all .2s ease-in-out;}.thumbnail > img,.thumbnail a > img {margin-right: auto;margin-left: auto;}a.thumbnail:hover,a.thumbnail:focus,a.thumbnail.active {border-color: #428bca;}.thumbnail .caption {padding: 9px;color: #333;}来看一个例子：
关于本文给大家介绍的Bootstrap缩略图组件与警示框组件的相关知识就给大家介绍这么多，希望对大家有所帮助！
