我想让216主题“填满”高度,即使页面是空的。所以如果内容未填满,则为最小全高。
Twenty sixteen - full height
1 个回复
最合适的回答,由SO网友:bravokeyl 整理而成
我不知道你为什么要那样做,但是。。
我们可以使用min-height
具有vh
(查看端口高度)单位。将页面高度设置为100vh
意味着我们正在说的页面要填充全视图端口高度。
.site {
min-height: 100vh;
}
但这在iOS7中不起作用。因此,解决方法是。/**
* iPad with portrait orientation.
*/
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:portrait){
.site {
min-height: 1024px;
}
}
/**
* iPad with landscape orientation.
*/
@media all and (device-width: 768px) and (device-height: 1024px) and (orientation:landscape){
.site {
min-height: 768px;
}
}
/**
* iPhone 5
* You can also target devices with aspect ratio.
*/
@media screen and (device-aspect-ratio: 40/71) {
.site {
min-height: 500px;
}
}
References: