Bootstrap CSS 图像参考


Bootstrap 图像

圆角:

Cinque Terre

圆圈:

Cinque Terre

缩略图:

Cinque Terre

<img> 类

以下类可用于设置任何图像的样式:

描述 实例
.img-rounded 为图像添加圆角(在 IE8 中不可用) 测试一下
.img-circle 将图像塑造成圆形(在 IE8 中不可用) 测试一下
.img-thumbnail 将图像整形为缩略图 测试一下
.img-responsive 使图像响应式(将很好地缩放到父元素) 测试一下

响应式图像

通过将 .img-responsive 类添加到 <img> 标记来创建响应式图像。 然后图像将很好地缩放到父元素。

.img-responsive 类将 max-width: 100%, height: auto, 和 display:block 应用于图像:

实例

<img src="cinqueterre.jpg" class="img-responsive" alt="Cinque Terre">
亲自试一试 »