图像
bootstrap为图像预加载提供了很简洁的样式。（CDN：http://placehold.it/140x140；）
PS：该CDN链接后的140x140可以根据网站需要更换合适的尺寸。例如：1024x960,1250x1600等等
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>图像</title> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> </head> <body> <div class="container"> <div class="row"> <div class="col-sm-4"> <img alt="140x140" src="http://placehold.it/140x140"> <div>默认图片</div> </div> <div class="col-sm-4"> <img class="img-rounded" alt="140x140" src="http://placehold.it/140x140"> <div>圆角图片</div> </div> <div class="col-sm-4"> <img class="img-circle" alt="140x140" src="http://placehold.it/140x140"> <div>圆形图片</div> </div> <div class="row"> <div class="col-sm-6"> <img class="img-thumbnail" alt="140x140" src="http://placehold.it/140x140"> <div>缩略图</div> </div> <div class="col-sm-6"> <img class="img-responsive" alt="140x140" src="http://placehold.it/140x140" /> <div>响应式图片</div> </div> </div> </div> </div> </body> </html>
bootstrap提供一下几种风格：
1、img-responsive：响应式图片，主要针对于响应式设计
2、img-rounded：圆角图片
3、img-circle：圆形图片
4、img-thumbnail：缩略图片
5、img-responsive：响应式图片
效果图
图标
bootstrap还提供了丰富的图标资源。
风格：glyphicon glyphicon-cloud（样式名称）
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <title>图标</title> <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css"> </head> <body> <span class="glyphicon glyphicon-search"></span> <span class="glyphicon glyphicon-asterisk"></span> <span class="glyphicon glyphicon-plus"></span> <span class="glyphicon glyphicon-cloud"></span> <p class="glyphicon glyphicon-home"></p> <a class="glyphicon glyphicon-remove"></a> <button class="glyphicon glyphicon-star"></button> </body> </html>
代码效果
图标列表
原文：http://www.cnblogs.com/MirageFox/p/5037709.html
