Chrome 154 中的响应式 Iframe
Chrome 154 新增响应式 iframe 支持：嵌入文档的内禀尺寸可直接驱动 iframe 尺寸，替代过去手动测量内容高度、postMessage 传尺寸、再 JS 更新 iframe 高度的套路。 核心是新增 CSS 属性 frame-sizing（auto / content-width / content-height / content-inline-size / content-block-size），嵌入页写 frame-sizing: content-height 即可让 iframe 随内容高度自适应；被嵌入文档需在 head 加 （可限制到特定源，逗号或空格分隔多个 origin），与 CSP frame-ancestors 互补。 动态内容变更后需显式调用 window.requestResize 触发重新测量，避免 resize 循环。支持跨源嵌入，可用 @supports (frame-sizing: content-height) 做渐进增强，老浏览器仍走固定高度 + JS 方案。 官方给了 CodePen demo。对做评论组件、社交嵌入、第三方 widget 的前端直接可用，HN 讨论点：与 Shadow DOM / postMessage 方案的取舍、多 origin 限制粒度、是否会引发新的布局抖动。 
评论
点赞
收藏