本篇文章带大家一起了解一下Bootstrap中的图片组件和轮廓组件,介绍一下响应式图片、图片缩略图、picture标签和轮廓(Figures),希望对大家有所帮助!
1 图片
本文节将学习如何让图片支持响应式行为(这样它们就不会超出父元素的范围)以及如何通过类(class)添加些许样式。
1.1 响应式图片
通过 Bootstrap 所提供的.img-fluid 类让图片支持响应式布局。其原理是将max-width: 100%; 和 height: auto; 赋予图片,以便随父元素一起缩放。【