SPFx扩展实现Teams站点区域全屏显示需修改的CSS类

• 针对页面整体宽度限制：Teams嵌入的SharePoint页面里，#spPageCanvasContent是核心容器类，默认会限制最大宽度，直接覆盖它的样式即可：

#spPageCanvasContent {
    max-width: 100vw !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

• 针对特定Web部件区域：如果只需要让单个Web部件区域全屏，CanvasZone类是关键，调整它的宽度和外边距：

.CanvasZone {
    max-width: 100% !important;
    margin: 0 !important;
}

• 处理Teams嵌入层约束：Teams框架的嵌入容器可能也会限制宽度，补充调整teams-frame样式：

.teams-frame {
    width: 100vw !important;
}

• 实用提示：不同版本的Teams/SharePoint可能有样式类细微差异，直接用浏览器F12开发者工具定位当前页面的宽度限制元素，实时查看类名是最准确的方法。!important用来强制覆盖默认内联样式，确保你的SPFx扩展注入的CSS优先级足够高。

内容的提问来源于stack exchange，提问作者josh139