Bootstrap CSS 图片参考


Bootstrap图片

圆角:

Cinque Terre

圆圈:

Cinque Terre

缩略图:

Cinque Terre

<img> 类

下面的类可用于设置任何图片的样式:

Class Description Example
.img-rounded Adds rounded corners to an image (not available in IE8) 尝试一下
.img-circle Shapes the image to a circle (not available in IE8) 尝试一下
.img-thumbnail Shapes the image to a thumbnail 尝试一下
.img-responsive Makes an image responsive (will scale nicely to the parent element) 尝试一下

响应式图片

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

这个.img-responsive类别适用max-width: 100%,height: auto, 和display:block到图片:

示例

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