css设置高度height: 100%滚动条无法显示的解决办法

有是在写样式的时候，会碰到给div无论怎么加样式 overflow-y: auto 的时候，都不会出现垂直的滚动条，经过不断折腾终于知道是啥原因导致了。

<style>
body{
height: 100%; //若是所有的div的高度都不固定，需要body高度也是100%，才可以出现滚动条
}
.parent{
//你自己样式
height: 100%; //父元素的高度也需要是100%才可以出现滚动条
}
.children{
overflow-y: auto;
overflow-x: hidden;
height: 100%;
}
</style>
 
<div class="parent">
<div class="children">
xx-blog主题
xxzhuti主题网
</div>
</div>

大家可以试试，这样子是无法出现滚动条的，若是想要出现滚动条，需要所有父元素的高度也要是百分之百，这样才可以。

还有一种就是给父元素设置浮动，也可以出现滚动条，按照你自己页面的需求写即可

f<style>
.parent{
height: 100%; //父元素的高度也需要是100%才可以出现滚动条
position: fixed;
right: 0;
top: 0;
bottom: 0;
z-index: 2;
}
.children{
overflow-y: auto;
overflow-x: hidden;
height: 100%;
}
</style>
 
<div class="parent">
<div class="children">
xx-blog主题
xxzhuti主题网
</div>
</div>

欢迎关注我的公众号“xx主题网”，原创技术文章第一时间推送。

文章来源：https://www.xxzhuti.com/689.html

---