额外空间 使用 FLEXBOX 重新想象 Jan 8, 2024 13:11:31 GMT 8 Quote Select PostDeselect PostLink to PostMemberGive GiftBack to Top Post by account_disabled on Jan 8, 2024 13:11:31 GMT 8 UI 模式Zell Liew 的一项实验表明,Flexbox 的强大功能超越了常见的布局任务。他使用 Flexbox 重新构想了随处可见的 UI 模式:星级元素。~他的 Flexbox 版本只需要 50 行代码和 SVG 中的五颗星,并且使用同级选择器、flex-flow属性和的组合来实现row-reverse。漂亮! CJ Cenizal 的Flexbox 模式还展示了使用 Flexbox 的强大功能来构建 UI 组件的方法。它提供了交互式示例以及开始使用步进器输入、选项卡、表单页脚、居中提示、侧边栏等所需的源代码。 工具和其他资源计算 FLEX 项目的宽度如果计算 Flex 项目的宽度让您头疼,那么Flexbox Tester适合您。只需输入flex-grow、flex-shrink和flex-basis三个弹性项目的值即可查看它们的行为方式。 处理错误和解决。方法当然,与任何技术一样,Flexbox 也并非没有错误。当您遇到问题时,Flexbugs一定会提供解决方案。社区整理的 Flexbox 问题列表会定期更新,以提供解决方案和浏览器解决方法。如果您发现尚未列出的错误,您可以通过 GitHub 报告。说到浏览器解决方法:Flexibility polyfill为不支 Whatsapp 号码列表 持 Flexbox 的旧版 Internet Explorer 提供了修复。它检测页面上受 Flex 影响的元素,并在 IE 8 和 9 中相应地重新设置它们的样式。 您有什么要添加到列表中的吗?请在下面的评论部分告诉我们您最喜欢的 Flexbox 资源。诺亚向移动可用性测试的转变 阅读时间 19 分钟 讲故事, 移动, 测试, 可用性 在Twitter、 LinkedIn上分享 林登·塞雷霍 关于作者 Lyndon Cerejo 是一位 UX 设计领导者,拥有超过 25 年的实践。经验,帮助公司设计可用且引人入胜的体验…… 更多关于 Lyndon ↬ 电子邮件通讯 你的邮件 关于前端和用户体验的每周提示。 受到超过 200,000 人的信赖。 通过我们友好的前端和设计在线研讨会在线提高您的技能。 SmashingConf 用户体验与设计,安特卫普 2024 年 通过我们关于前端和设计的友好会议在线提高您的技能。 用户体验策略大师班,与维塔利·弗里德曼 (Vitaly Friedman) 合作 通过我们关于前端和设计的友好会议在线提高您的技能。 SmashingConf 弗莱堡 2024 通过我们友好的前端和设计在线研讨会在线提高您的技能。 智能界面设计清单 这是《Smashing》杂志的一项实验,其格式略有不同——使用讲故事的方法来传达与传统文章相同的经验教训。在本文中,林登·塞雷霍 (Lyndon Cerejo) 将带。