AnnLing

图片

1、响应式图片

在 Bootstrap 版本 3 中,通过为图片添加 .img-responsive 类可以让图片支持响应式布局。其实质是为图片设置了 max-width: 100%;height: auto;display: block; 属性,从而让图片在其父元素中更好的缩放。

如果需要让使用了 .img-responsive 类的图片水平居中,请使用 .center-block 类,不要用 .text-center请参考助手类章节 了解更多关于 .center-block 的用法。

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

2、图片形状

通过为 <img> 元素添加以下相应的类,可以让图片呈现不同的形状。

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

 

 

分类:

技术点:

相关文章:

  • 2021-12-12
  • 2021-05-06
  • 2021-09-01
  • 2021-07-08
  • 2021-10-17
  • 2021-12-31
  • 2022-01-27
猜你喜欢
  • 2022-01-10
  • 2022-02-18
  • 2021-12-09
  • 2021-11-17
  • 2021-09-03
  • 2021-11-17
  • 2021-12-26
相关资源
相似解决方案