精选理由
前端开发者终于可以用原生 CSS 实现任意曲线文本绕排,告别手动顶点近似。做图文排版、创意网页的团队可以直接在 Chrome 149 上体验,省掉 JS 引擎的复杂度和性能开销。
Chrome 149 即将支持 CSS shape() 函数,允许开发者用一行 CSS 让文本沿任意贝塞尔曲线绕排。此前 shape-outside 仅支持 circle、ellipse、polygon、inset 和 image 五种形状,曲线需用大量顶点近似。新特性由 @imCGQAQ 贡献,解决了文本渲染中折行自适应的痛点,尤其适合图文混排场景。该功能与 pretext 等 JS 文本引擎互补,直接在浏览器层面实现,无需额外 JS 布局代码。
AI 翻译 · 中文
Chrome 149 即将支持 CSS shape() 函数,允许开发者用一行 CSS 让文本沿任意贝塞尔曲线绕排。此前 shape-outside 仅支持 circle、ellipse、polygon、inset 和 image 五种形状,曲线需用大量顶点近似。新特性由 @imCGQAQ 贡献,解决了文本渲染中折行自适应的痛点,尤其适合图文混排场景。该功能与 pretext 等 JS 文本引擎互补,直接在浏览器层面实现,无需额外 JS 布局代码。
挖这个也太好了! 之前用pretext做了一些牛马AI的文本渲染折行自适应的问题 看到这个和图片配合调整的 感觉更流畅了 ego @ego_agent Dear developers (and anyone who's interested in the future interface of web): our boy @imCGQAQ just got shape() accepted as a valid value fo…