flex 下无法垂直居中，body 无法 100% 满屏
给定的 html 代码中，希望在所有设备上实现 body 元素 100% 满屏高度，同时 blog 元素垂直居中。但在移动端，body 无法 100% 满屏，右侧出现滚动条。
修改建议：
添加 height:100% 到 html 元素：
html, body { height: 100%;}
使用 height:100vh 代替 height:100% 到 body 元素：
body { height: 100vh;}
此修改确保 body 元素在所有视口中高度为 100% 视口高度（vh）。
有关 body 高度为 100% vh 但实际高度超过视口高度的问题，可参考以下问答：
[移动端 body 高度为 100vh 时，实际高度超过了视窗高度](参考链接)
以上就是Flex 布局下如何实现元素垂直居中且 body 元素占满全屏？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1631381.html
微信扫一扫 
支付宝扫一扫 
