Articles on Smashing Magazine — For Web Designers And Developers
·
CSS中的砖石布局：Grid应该进化还是为新模块让路？
内容提要
CSS中的砖石布局有三种提案：扩展CSS Grid、独立模块和Apple的“Item Flow”。虽然CSS Grid有实验性砖石值，但浏览器支持有限，开发者通常使用JavaScript库。新提案“Item Flow”旨在整合三者优点，简化布局。最终选择需在简洁性、性能与灵活性之间取得平衡。
关键要点
-
CSS中的砖石布局有三种提案：扩展CSS Grid、独立模块和Apple的“Item Flow”。
-
CSS Grid的砖石值实验性存在，但浏览器支持有限，开发者通常使用JavaScript库。
-
新提案“Item Flow”旨在整合三者优点，简化布局。
-
CSS缺乏原生砖石支持，开发者需使用hack或JavaScript库。
-
扩展CSS Grid的提案允许使用grid-template-rows: masonry，但仍存在局限性。
-
独立的砖石模块提案提供了更灵活的布局方式，但需要从零开始。
-
Item Flow将Flexbox、Grid和砖石的概念合并为一个统一的布局系统。
-
每种方案都有其优缺点，需在简洁性、性能与灵活性之间取得平衡。
-
最终选择取决于浏览器的支持和社区的反馈。
延伸解读
浏览器支持的重要性
在选择砖石布局方案时，浏览器的支持程度至关重要。目前，CSS Grid的砖石值仅在Firefox Nightly中实验性存在，其他浏览器尚未普遍支持。这意味着开发者在实际应用中可能面临兼容性问题，使用JavaScript库仍是常见的解决方案。
新提案的潜力与挑战
Apple的Item Flow提案试图将Flexbox、Grid和砖石布局的优点结合起来，提供一个统一的布局系统。这种整合有助于简化开发流程，但仍需等待浏览器的实现和社区的反馈。开发者在选择时应关注这一提案的进展及其对现有布局的影响。
学习曲线与开发者适应性
扩展CSS Grid以支持砖石布局虽然熟悉，但可能会增加复杂性，影响开发者的学习曲线。相比之下，独立的砖石模块虽然清晰，但需要学习新的语法。开发者在选择布局方案时，应考虑团队的技术背景和适应能力。
延伸问答
CSS中的砖石布局有哪些提案？
CSS中的砖石布局有三种提案：扩展CSS Grid、独立模块和Apple的“Item Flow”。
为什么开发者通常使用JavaScript库而不是CSS Grid来实现砖石布局？
因为CSS Grid的砖石值实验性存在，浏览器支持有限，开发者常常需要使用JavaScript库来实现砖石布局。
Item Flow提案的主要优势是什么？
Item Flow提案旨在整合Flexbox、Grid和砖石的优点，简化布局，提供一个统一的布局系统。
扩展CSS Grid的提案有哪些局限性？
扩展CSS Grid的提案存在局限性，如可能导致复杂的布局和浏览器兼容性问题，且仍处于实验阶段。
独立的砖石模块提案有什么特点？
独立的砖石模块提案提供了更灵活的布局方式，但需要从零开始，可能导致开发者的选择困惑。
在选择砖石布局方案时需要考虑哪些因素？
选择砖石布局方案时需考虑简洁性、性能与灵活性之间的平衡，以及浏览器的支持和社区的反馈。
