css按百分比宽度容器下图片显示为正方形

发布时间:
2019-07-03 6:47:53

百分比宽度下图片显示正方形

没有想到一个比较合适的标题,当前这个标题表述的可能不太准确,实际应用场景为当父容器按百分比显示,父容器并不是一个正方形的情况下,下面的图片如何按父容器的百分比显示成一个正方形。

这里讲一下实现原理:需要想办法先把父容器变成正方形,并设置相对定位。然后图片高宽100%进行进绝对定位top:0;left:0,这样便能实现我们想要的效果。下面附上代码:

温馨提示: 此处内容需要评论本文后才能查看.

Good luck!

共有 0 条评论

You must be logged in to post a comment.