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

2021年2月23日 飞飞 阅读(2.91K)
知识付费主题,优惠促销中:xx-blog主题

有是在写样式的时候,会碰到给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>

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

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

<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主题网

第一时间了解最新网络动态
关注博主不迷路~

未经允许不得转载:xx主题网 » css设置高度height: 100%滚动条无法显示的解决办法
分享到:

评论抢沙发

要发表评论,您必须先

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

扫码关注微信公众号

扫描关注xx主题网