跳到主要内容

1 篇博文 含有标签「CSS」

查看所有标签

· 阅读需 9 分钟
Skyone

今天在 medium 看到一篇关于 Google Photos 的文章,里面详细的介绍了谷歌的一名工程师是如何设计 Google Photos 的布局的,文章地址:Building the Google Photos Web UI

观察了一下 Google Photos 的布局,发现它的布局非常的有意思,有以下特点:

  • 一行图片的宽度始终刚好占满容器宽度
  • 图片全部保持原始比例,不会被拉伸
  • 图片的高度不一,但是每一行的高度是一样的
  • 图片顺序不会被改变

感觉很神奇,但是那篇文章里的实现方法太过复杂,虽然性能非常好,但是我觉得可以用更简单的方法来实现,于是就有了这篇文章。