扫码关注官方订阅号
传统的瀑布流是宽度固定,现在有个需求是宽度是随机的瀑布流,这可以实现吗?
欢迎选择我的课程,让我们一起见证您的进步~~
我觉得可以这样,根据列数先算出随机范围,留最后一列用总宽度减
可以用框架的 比如bootstrap
个人觉得主要还是看你要展示的内容性质吧,一般瀑布流项目都是有点击之后展示详细操作的,所以也就是展示一个摘要,宽度固定算是比较合理的一种布局方式,毕竟固定一边,另一边 - 高度计算也就随原始大小等比例得出,同时宽度固定也可以在纵向两边对齐(基于展示项基本顺序,列表最下面可能无法对齐),符合我们的视觉习惯。
而高度固定,每行左对齐的话,则势必会造成右边对齐困难。参考QQ相册的照片视图,有些图片做了一些裁剪显示实现行末对齐。
所以如果宽高都不固定的,又在行末有对齐要求的话,势必需要就列表数据整体评估,然后调整展示顺序... 想想还是比较复杂,出来的效果应该也不见得是需求方想要的。
所以,至少也是有限的几种固定宽度,而不是随机宽度。
看看这篇文章的分享:http://blog.brain1981.com/829.html
我觉得根据每列的宽度和屏幕的宽度,进行分配
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
扫描下载App
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
我觉得可以这样,根据列数先算出随机范围,留最后一列用总宽度减
可以用框架的 比如bootstrap
个人觉得主要还是看你要展示的内容性质吧,一般瀑布流项目都是有点击之后展示详细操作的,所以也就是展示一个摘要,宽度固定算是比较合理的一种布局方式,毕竟固定一边,另一边 - 高度计算也就随原始大小等比例得出,同时宽度固定也可以在纵向两边对齐(基于展示项基本顺序,列表最下面可能无法对齐),符合我们的视觉习惯。
而高度固定,每行左对齐的话,则势必会造成右边对齐困难。参考QQ相册的照片视图,有些图片做了一些裁剪显示实现行末对齐。
所以如果宽高都不固定的,又在行末有对齐要求的话,势必需要就列表数据整体评估,然后调整展示顺序... 想想还是比较复杂,出来的效果应该也不见得是需求方想要的。
所以,至少也是有限的几种固定宽度,而不是随机宽度。
看看这篇文章的分享:http://blog.brain1981.com/829.html
我觉得根据每列的宽度和屏幕的宽度,进行分配