小编典典

使用CSS使div可垂直滚动

html

这个

<div id="" style="overflow:scroll; height:400px;">

给出了一个div用户可以水平和垂直滚动的功能。如何更改它以便div 可垂直滚动?


阅读 844

收藏
2020-05-10

共1个答案

小编典典

除了使用错误的属性外,还可以解决它。滚动条可与任何财产被触发overflowoverflow-x或者overflow-y每个人都可以被设置为任意的visiblehiddenscrollauto,或inherit。您目前正在查看以下两个:

  • auto-此值将查看盒子的宽度和高度。如果已定义它们,则不会使框扩展到这些边界之外。而是(如果内容超出了这些边界),它将为超出其长度的任意一个边界(或两个边界)创建一个滚动条。

  • scroll- 即使内容未超出边界设置,此值也会 强制 滚动条,无论如何。如果不需要滚动内容,则该栏将显示为“禁用”或非交互式。

如果您 始终 希望垂直滚动条出现:

您应该使用overflow-y: scroll。无论是否需要,这都会 强制
在垂直轴上显示滚动条。如果您实际上无法滚动上下文,它将显示为“禁用”滚动条。

如果只希望滚动条出现,则可以滚动该框:

只需使用overflow:auto。由于默认情况下,您的内容仅在不适合当前行时会中断至下一行,因此不会创建水平滚动条(除非它位于禁用了自动换行的元素上)。对于垂直条,它将允许内容扩展到您指定的高度。如果超过该高度,它将显示一个垂直滚动条以查看其余内容,但是如果不超过该高度,则不会显示滚动条。

2020-05-10