BootStrap中的缩略图

2019-04-15 16:22发布

class="markdown_views prism-atom-one-light">

BootStrap中的缩略图

将图片元素包裹在带有.thumbnail类的链接< a >元素中即可以创建一个缩略图。缩略图会添加四个像素的内边距(padding)和一个灰 {MOD}的边框,当鼠标悬停在图像上时会动画显示出图像的轮廓。
代码如下:
效果如下:
在这里插入图片描述 图像形状:
通过给图像元素应用下面几个样式类,可以让图像呈现出不同的形状。
img-rounded:添加border-radius:6px ;获得图像圆角。
img-circle:添加border-radius:500px ;让整个图像变成圆形。
img-thumnail:添加一些内边距(padding)和一个灰 {MOD}的边框,图像呈现缩略图样式。
代码如下: 圆角 圆形 缩略图样式