内容超出高度显示滚动条

您可以使用 CSS 属性 `overflow: auto;` 来实现内容超出高度显示滚动条的效果。

示例代码：

<div style="height: 200px; overflow: auto;">
  <!-- 这里放置要显示的内容 -->
</div>

在上面的代码中，我们将 `div` 元素的高度设置为 200 像素，并将 `overflow` 属性设置为 `auto`，这将使内容超出 `div` 元素的高度时出现垂直滚动条。

您可以根据需要调整 `div` 元素的高度和 `overflow` 属性的值来适应您的页面布局和内容。

相关问题

css 超出高度显示 滚动条

在CSS中，当元素的内容超出其容器的高度时，滚动条会自动出现，让用户能够浏览超出的部分。以下是几种常见的实现方式：

1. **overflow: auto;** 这是最常用的滚动方式。当内容溢出（`overflow` 属性默认值为 `visible`），设置为 `auto` 后，如果内容超过容器高度，就会出现水平和垂直滚动条。

.container {
   overflow: auto;
   height: 200px; /* 容器高度限制 */
}

2. **overflow-y: scroll;** 如果只想显示垂直滚动条，可以只针对垂直方向设置 `scroll`。

.container {
   overflow-y: scroll;
   height: 200px;
}

3. **overflow-x: scroll;** 对于只希望水平滚动的情况，可以单独设置 `overflow-x`。

.container {
   overflow-x: scroll;
   width: 200px; /* 容器宽度限制 */
   height: 100vh; /* 自适应高度 */
}

4. **height: 100%;** 如果容器是相对定位的，并且需要响应式内容高度，你可以使用百分比高度，但可能需要配合其他布局技术（如 flex 或 grid）来处理滚动。

为了更好地控制滚动行为，还可以调整滚动条的样式，如颜色、厚度等，通过 `::-webkit-scrollbar` 和 `::-webkit-scrollbar-thumb` 伪元素来定制。

nz-tooltip内容过长，超出一定高度显示滚动条

对于 nz-tooltip 的内容过长导致超出一定高度的情况，你可以使用 CSS 样式来实现显示滚动条的效果。你可以为 nz-tooltip 添加一个自定义的 class，并在该 class 中设置 `max-height` 和 `overflow` 属性。

首先，为 nz-tooltip 添加一个自定义的 class，比如 `tooltip-scrollable`：

<nz-tooltip class="tooltip-scrollable" nzTitle="这是一个过长的内容..."></nz-tooltip>

然后，在你的 CSS 文件中或者样式代码块中，为该 class 设置样式：

.tooltip-scrollable {
  max-height: 200px; /* 设置最大高度 */
  overflow: auto; /* 设置溢出时显示滚动条 */
}

通过设置 `max-height` 属性，你可以控制 tooltip 的最大高度，超过该高度时将出现滚动条。设置 `overflow` 属性为 `auto` 可以在内容溢出时显示滚动条。

根据实际需要，你可以调整 `max-height` 的值以及其他样式属性来适应你的界面需求。