如何在HTML, body和#app元素中设置最佳大小以适配内容？-灵析社区
一只臭美的Doggg设置html,body,#app大小的最佳方式是什么？ 我们在使用框架的时候，往往我们的内容会被包含在#app中。 当我们的内容包含在body中的时候，我往往会这样设置html, body的大小。 html{ block-size: 100%; } body { min-block-size: 100%; } 当有了#app时，该怎么设置合适呢?这样吗? html{ block-size: 100%; } body { block-size: 100%; } #app { min-block-size: 100%; }
感觉对了直接使用 "width: 100vw; height:100vh" 不行吗？
如果可能考虑到移动端的浏览器地址栏和工具栏遮住一部分的问题，可以考虑使用 "width: 100dvw; height: 100dvh"
不过我们一般也不会去设置 "#app" 的宽高吧，宽度就是块级布局的默认 "100%" 高度则按照内容自动。
除了一些限制显示区域的管理后台或者一些特殊的需求，才会考虑说限制布局的高度在指定区域内滚动。
所以可能把你想要实现的具体目的描述一下？为了实现什么，如果单纯为了限制 "#app" 的高度那么就用 "vh/dvh" 这种基于
"Viewport" (https://link.segmentfault.com/?enc=DZ3ZabEiDWwpEmVQ59ayCw%3D%3D.%2Br6i5GelyFXlg5ywetDl8vv2sAj51nBERA1LHRT2eZDdQkWF1u6jOluwoB5zwuTz8%2Bf3Ugy8LPJxrAc%2FA7g4ZQ%3D%3D)
单位就好了
***
* "#单位 - - CSS | MDN" (https://link.segmentfault.com/?enc=nN8kbhd2espvuj8C61xoag%3D%3D.dOUJLR%2FGebUI2yhqxc077%2F18RFVeR%2FYcerFLYuD%2F5dTGhRSQy6DycDGWN5SN%2FEMmtUtCFJrB7%2FCh%2FW4DEJJC%2BwG6HR2q2hucSMaZ6L0v2Go%3D)
* "#6.1.2.2. The Various Viewport-relative Units | CSS Values and Units Module Level 4" (https://link.segmentfault.com/?enc=h3P9cAWtQOPqlwNDL1SZHw%3D%3D.UyH8auVxdvwIJ1Si6HbcT04x5grpkmWW7uWvLXcer%2Fb80xxOIiaefXqRZo3q9U53sQDn8%2FsYgooRXhcUzAkWTA%3D%3D)
* "移动端 body 高度为100vh 时，实际高度超过了视窗高度。 - SegmentFault 思否" (https://segmentfault.com/q/1010000020155101?_ea=349980086)