问题描述:页面顶部和底部是固定的,中间部分显示动态内容,但是为了适配,中间部分的高度不能写死,所以采用calc方式,但是尝试使用calc(100%-100px)和calc(100vh-100px)均无效。
解决办法:网上找了很多资料,最后才发现这是calc的一个坑,正确的写法如下:
height:calc(100vh - 100px);
发现区别了吗?是不是一脸懵逼。其实区别就在于100vh和100px之间的-前后要加空格。
2023-12-22 22:43:40
问题描述:页面顶部和底部是固定的,中间部分显示动态内容,但是为了适配,中间部分的高度不能写死,所以采用calc方式,但是尝试使用calc(100%-100px)和calc(100vh-100px)均无效。
解决办法:网上找了很多资料,最后才发现这是calc的一个坑,正确的写法如下:
height:calc(100vh - 100px);
发现区别了吗?是不是一脸懵逼。其实区别就在于100vh和100px之间的-前后要加空格。