Nintex/SharePoint 2016表单滚动条移除：!important无法覆盖样式

针对你遇到的滚动条无法隐藏、CSS被覆盖的问题，我们可以从精准元素定位、iframe跨文档样式控制和优先级提升这几个方向来解决：

1. 先精准定位目标元素（避免选择器太通用） #

你之前用的.overflowY是比较通用的类，很容易被SharePoint或Nintex的内置样式覆盖。首先打开浏览器开发者工具（F12），找到表单内页面查看器的实际包裹容器：

• 如果是Nintex页面查看器控件的外层容器，它通常会带专属类，比如.nf-page-viewer或.nf-page-viewer-frame-container
• 用更具体的选择器来写CSS，比如：

  /* 针对Nintex页面查看器的容器 */
  .nf-page-viewer-frame-container {
      overflow-y: hidden !important;
  }
  

2. 处理iframe内部的滚动条（核心难点） #

如果滚动条是来自页面查看器里的iframe内容，外部CSS默认无法影响iframe内部的文档，这时候要分两种情况：

同域内容（比如SharePoint站点内的页面） #

直接在iframe加载的目标页面中添加自定义CSS：

body, html {
    overflow-y: hidden !important;
    margin: 0; /* 避免默认边距导致的滚动条 */
}

跨域内容 #

跨域情况下无法直接修改iframe内部样式，只能通过调整iframe高度适配内容来隐藏滚动条。可以在Nintex表单里添加JavaScript动作：

// 获取页面查看器的iframe元素
var pageViewerIframe = document.querySelector('.nf-page-viewer iframe');
if (pageViewerIframe) {
    // 等待iframe加载完成后调整高度
    pageViewerIframe.onload = function() {
        // 获取iframe内容的实际高度
        var contentHeight = pageViewerIframe.contentWindow.document.body.scrollHeight;
        // 设置iframe高度为内容高度，同时隐藏容器滚动条
        pageViewerIframe.style.height = contentHeight + 'px';
        pageViewerIframe.parentElement.style.overflow = 'hidden';
    };
}

3. 提升CSS选择器优先级（解决样式被覆盖） #

如果还是被其他样式覆盖，可以组合更多父级选择器来提高优先级，比如结合SharePoint的#s4-workspace和Nintex表单的容器类：

#s4-workspace .nf-form-container .nf-page-viewer .overflowY {
    overflow-y: hidden !important;
}

如果能找到目标元素的ID（开发者工具里查看），用ID选择器优先级更高：

#yourPageViewerId .overflowY { /* 替换成实际的元素ID */
    overflow-y: hidden !important;
}

4. 验证CSS是否生效 #

用浏览器F12的元素检查器选中目标元素，查看「样式」面板：

• 如果你的自定义CSS被划掉，说明优先级不够，需要优化选择器
• 确认你的自定义CSS是添加到Nintex表单的「自定义CSS」区域（表单设置里的选项），确保加载顺序在内置样式之后

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