固定和相对高度的混合物可能吗?

时间:2014-01-10 11:37:18

标签: html css css3 height

这可能是一个愚蠢的问题,但它是否有可能使元素的高度达到100% - 例如200像素。

我知道这不起作用,但我的意思是这样的:

#div {height:100%-200px}

我需要这个的原因是因为我不希望元素从页面顶部(标题)开始,也不希望在底部(页脚)结束。我知道我也可以使用margin-bottom和margin-top,或者通过z-index,但我宁愿为我的元素设置一个确定的高度。我只是想知道是否可能。

提前致谢!

1 个答案:

答案 0 :(得分:2)

如果旧浏览器支持不是问题,您可以使用calc

height:calc(100% - 200px)
           /* ^^ ^^ these space are important!! */

对于跨浏览器,请以这种方式使用它:

height:-webkit-calc(100% - 200px);
height: -moz-calc(100% - 200px);
 /* mind the spaces around the operator, they are important 
   to let calc() operation happen */

在这里阅读更多内容:

http://css-tricks.com/a-couple-of-use-cases-for-calc/

https://developer.mozilla.org/en-US/docs/Web/CSS/calc