最近在开发过程中遇到了关于滚动条的一些问题,多次实验后现将总结的经验记录分享下来,希望能够帮助到有疑问的小伙伴们~
一、滚动条何时出现
一般是要展示的内容比较宽或者比较长,指定宽度或高度的元素无法装下这些内容,就需要滚动条了。 也就是说滚动条出现需要三个条件: 1、内容超出指定元素的高度或宽度; 2、垂直滚动条设置overflow-y:auto,横向滚动条设置overflow-x: auto; (其中auto改为scroll也可)
二、滚动条出现在哪个元素
假如有以下结构的div元素:包括左侧导航栏和右侧内容。
1、如果子元素
样式不设置height:100%; 或者设置min-height:100% 则滚动条就会出现在父元素
上;
2、如果子元素设置了height:100%; 滚动条就会出现在该元素本身。