Chrome团队总结的2023 CSS发展总结。
随着技术的发展,web段功能也越来越强大,一些原本Web平台无法实现的功能现在也都可以实现,除了原生移动端和桌面端,浏览器端越来越被大家重视起来。本文总结了一些有意思的新功能分享给大家。
子网格
借助 CSS subgrid,您可以创建更复杂的网格,并在子布局之间实现更好的对齐。它允许另一个网格内的网格将外部网格的行和列作为自己的行和列,方法是使用 subgrid 作为网格行或列的值。
subgrid 非常适合用来根据彼此的动态内容对齐同级。这可让文案撰写人员、用户体验作者和翻译人员尝试创建“适合”布局的项目副本。借助 subgrid,可以调整布局以适应内容。
首字母
今年年初在 Chrome 110 中推出 initial-letter 属性,这是一项虽然小巧但功能强大的 CSS 功能,可用于为首字母的放置位置设置样式。您可以将字母的位置调整为放下或抬起。该属性接受两个参数:第一个表示将字母放在相应段落中的深度,第二个表示将字母放在上方字母的升高。您甚至可以结合运用这两种方式,如以下演示所示。