CSS中设置元素高度自适应，不出现滚动条

如果我们想设置外层容器为浏览器高度的100%，同时高度自适应，不出现滚动条，可以将高度设置为浏览器视口的高度，代码如下：

<style scoped>
.element {
	height: 100vh;/*元素的高度为浏览器视口的高度*/
}
</style>

但是当我们遇到有固定高度的菜单栏时，此时高度设置为100vh将会产生滚动条，
此时可以用100vh减去固定高度，直接相减会报错，此时可以使用calc()函数，代码如下：

<style scoped>
.element {
	height: calc(100vh-60px);/*元素的高度减去固定高度*/
}
</style>