非常教程

Bootstrap 3参考手册

CSS

图片 | Images

Images

响应式图像

Bootstrap 3中的图像可以通过添加.img-responsive类来响应友好。这适用max-width: 100%;height: auto;display: block;在图像,使其很好地扩展到父元素。

要使用.img-responsive该类的图像居中,请使用.center-block而不是.text-center。有关.center-block使用的更多详细信息,请参阅帮助程序类部分。

SVG图像和IE 8-10

在Internet Explorer 8-10中,SVG图像的.img-responsive大小不成比例。要解决此问题,请width: 100% \9;在必要时添加。Bootstrap不会自动应用,因为它会导致其他图像格式的复杂化。

<img src="..." class="img-responsive" alt="Responsive image">

图像形状

<img>元素添加到元素中以轻松设置任何项目中的图像样式。

跨浏览器兼容性

请记住,Internet Explorer 8不支持圆角。

Open example on getbootstrap.com

<img src="..." alt="..." class="img-rounded">
<img src="..." alt="..." class="img-circle">
<img src="..." alt="..." class="img-thumbnail">
Bootstrap 3

Bootstrap 是全球最受欢迎的前端组件库,用于开发响应式布局、移动设备优先的 WEB 项目。

主页 https://getbootstrap.com/
源码 https://github.com/twbs/bootstrap
版本 3
发布版本 3.3.7