Google Sites嵌入Google Apps Script后内容截断及滚动条问题求助

• 调整Apps Script的响应式样式适配容器
  在Apps Script的HTML页面头部添加全局样式，强制页面内容完全适配嵌入容器，避免溢出产生滚动条：

  html, body {
    width: 100% !important;
    height: 100% !important;
    margin: 0;
    padding: 0;
    overflow: hidden !important;
  }
  

  同时页面内的所有元素尽量使用相对单位（如%、vw/vh）替代固定像素值，确保内容能随容器尺寸自动缩放。

• 修改Google Sites嵌入板块的尺寸配置
  在Google Sites编辑界面选中嵌入板块，点击右上角的调整大小按钮，选择「自动调整」模式；若自动调整无效，可手动设置容器的宽高比例，或勾选「允许全屏」选项，给内容足够的展示空间。
  也可以在Apps Script中通过客户端脚本动态向容器报告内容高度，辅助Google Sites调整容器尺寸：

  window.addEventListener('load', () => {
    const contentHeight = document.body.scrollHeight;
    window.parent.postMessage({ type: 'setHeight', height: contentHeight }, '*');
  });
  

• 优化Apps Script内容结构
  无需拆分多个脚本，可在内容中添加折叠面板，让用户按需展开长内容，减少容器空间占用：

  <details>
    <summary>点击展开更多内容</summary>
    <div>原本会导致截断的长内容区域...</div>
  </details>
  

• 更换嵌入方式
  尝试使用Google Sites的「从Drive添加」嵌入选项，直接关联已部署的Apps Script链接，而非复制嵌入代码。这种原生关联方式通常会自动适配容器尺寸，降低滚动条出现的概率。

内容的提问来源于stack exchange，提问作者Paulina Drożdż