JimmyLv / reading

My Reading List | 参考博客文章「Serverless 实战:打造个人阅读追踪系统」:
https://blog.jimmylv.info/2017-06-30-serverless-in-action-build-personal-reading-statistics-system/
26 stars 2 forks source link

纯 CSS 实现自适应正方形 #4627

Closed JimmyLv closed 5 years ago

JimmyLv commented 5 years ago

纯 CSS 实现自适应正方形

在处理移动端页面时,我们有时会需要将 banner 图做成与屏幕等宽的正方形以获得最佳的体验效果,如 Flipbord 的移动页面 : 那么应该怎么使用纯 CSS 制作出能够自适应大小的正方形呢? 方案一:CSS3 vw 单位 CSS3 中新增了一组相对于可视区域百分比的长度单位 vw, vh, vmin, vmax…

December 5, 2018 at 02:01PM
via Instapaper https://idiotwu.me/css-responsive-square/