chrome_win64_stable_104.0.5112.81

使用区域截取功能指定剪裁区域

借助 getDisplayMedia()，您可以从当前标签页创建视频串流。但有时，您只需要整个标签页的一小部分内容。到目前为止，实现此目的的唯一方法是手动剪裁每个视频帧。

借助区域截图功能，Web 应用可以定义要共享的屏幕的特定区域。例如，在 Google 幻灯片中，您可以保持标准编辑视图，并分享当前幻灯片。

如需使用它，请选择要共享的元素，然后根据该元素创建新的 CropTarget。接下来，通过调用 getDisplayMedia() 启动屏幕共享。系统会提示用户授予共享屏幕的权限。然后，调用 track.cropTo() 并传递之前创建的 cropTarget。

如需了解详情，请参阅借助区域截取功能更好地分享标签页。

借助第 4 级语法和评估功能，更轻松地使用媒体查询

媒体查询对自适应设计至关重要，可让您为不同的视口尺寸定义特定样式。不过，除非您每天都使用这些命令，否则语法可能会有点混乱。

Chrome 104 添加了对媒体查询 - 级别 4 - 语法和求值的支持，让您可以使用普通的数学比较运算符编写媒体查询。

因此，您不应使用以下代码来指明视口宽度介于 400 到 600 像素之间：

可以这样编写：

除了简化媒体查询，新语法还可以提高准确性。min- 和 max- 查询是包含边界的，例如：min-width: 400px 会测试 400px 或更大宽度。借助新语法，您可以进一步明确自己的意思。

Firefox 已支持该语法，并且有一个 PostCSS 插件，可将新语法重写为旧语法，从而确保浏览器兼容性！

如需了解详情，请参阅 Rachel 的文章 Chrome 104 中范围媒体查询的新语法。

共享元素转换功能开始新的源试用

特定于平台的应用通常在不同视图之间进行流畅的转换，外观美观，可让用户保持在上下文中，并有助于提升体验效果。而在 Web 上，完整导航可能会很粗糙，有时会导致屏幕瞬间空白。对于单页应用，情况可能会有所改善，但转换仍然很难。

共享元素转换功能（在 Chrome 104 中启动新的源试用）可让您提供流畅的转换，无论是跨文档转换（例如在多页面应用中）还是文档内转换（例如在单页面应用中）均可。

下面是一个粗略示例，展示了转场效果在单页应用中的运作方式。在导航函数中，获取新页面内容，然后检查是否支持转场效果，如果不支持，则在不使用转场效果的情况下更新页面。如果是，请创建 transition() 并对其调用 start()，以便在 DOM 更改完成时通知 API。

等等！

当然，还有许多其他功能。

• 使用显式 Expires 或 Max-Age 属性设置 Cookie 时，该值现在的上限为 400 天。
• 增强了多屏幕窗口展示位置 API。
• overflow-clip-margin CSS 属性用于指定元素的内容在被剪裁之前允许绘制的距离。

官方原文：New in Chrome 104