css如何让滚轮滚动时 不让页面滚动，但是body的滚动条不能消失

你可以使用CSS的`overflow`属性来实现这个效果。将`overflow`属性设置为`hidden`可以防止页面滚动，但是会隐藏滚动条。如果你想保留滚动条，可以将`overflow`属性设置为`scroll`。这样当页面内容超出容器的高度时，会出现滚动条，但是当滚轮滚动时，页面不会滚动。

以下是示例代码：

body {
  overflow-y: scroll; /* 显示滚动条 */
}

.container {
  height: 500px; /* 容器高度 */
  overflow-y: hidden; /* 隐藏滚动条 */
}

在这个例子中，我们将`body`的`overflow-y`属性设置为`scroll`，这样当页面内容超出`body`的高度时，会出现滚动条。然后我们创建了一个名为`.container`的容器，并将其高度设置为`500px`。接着，我们将`.container`的`overflow-y`属性设置为`hidden`，这样当滚轮滚动时，`.container`内的内容不会滚动，但是`body`的滚动条仍然保留。

相关问题

当 页面滚动条 触发时候 不让 body 滚动 让 子div滚动

你可以使用CSS和JavaScript来实现这个功能。

首先你需要在CSS中将body的overflow属性设置为hidden，这样就可以禁止整个页面的滚动了：

body {
  overflow: hidden;
}

然后你需要为子div添加一个自定义的样式，比如scrollable，用来控制子div的滚动：

.scrollable {
  overflow-y: scroll;
}

最后，你需要使用JavaScript来切换body和子div的样式。当滚动条触发时，将body的样式设置为hidden，同时将子div的样式设置为scrollable。当滚动条消失时，将body的样式设置为auto，同时将子div的样式移除：

// 获取子div
var div = document.getElementById("yourDivId");

// 监听滚动条事件
window.addEventListener("scroll", function () {
  // 判断滚动条状态
  if (window.scrollY > 0) {
    // 禁止body滚动
    document.body.style.overflow = "hidden";
    // 启用子div滚动
    div.classList.add("scrollable");
  } else {
    // 启用body滚动
    document.body.style.overflow = "auto";
    // 禁止子div滚动
    div.classList.remove("scrollable");
  }
});

注意，这段代码中的“yourDivId”是你需要替换为你的子div的id。

css如何让滚动条不占宽度

在CSS中，可以使用overflow属性来控制元素的滚动行为。要让滚动条不占据宽度，可以使用overflow:hidden属性来隐藏滚动条，并且保持元素的宽度不受滚动条的影响。

要实现这个效果，可以在目标元素的样式中设置如下的CSS属性：

.element {
  overflow: hidden; /* 隐藏滚动条 */
  width: 100%; /* 设置元素宽度 */
  ...
}

这样，无论滚动条是否出现，都不会改变元素的宽度。

请注意，使用overflow:hidden属性会隐藏滚动条，这意味着用户将无法手动滚动内容。因此，这种方法适用于那些不需要用户手动滚动的情况，比如一些固定的布局或者网站头部导航栏。

如果需要自定义滚动条的样式，并且仍然想让滚动条不占据宽度，可以使用一些CSS库或者框架，比如Perfect Scrollbar、SimpleBar等。这些工具可以让你定制滚动条的样式，并控制其宽度，以满足特定的设计需求。

总之，通过使用CSS的overflow:hidden属性，可以让滚动条不占据宽度，从而保持元素的宽度不受滚动条的影响。