【问题标题】:How to make image fit window height?如何使图像适合窗口高度?
【发布时间】:2013-12-17 06:00:15
【问题描述】:

我想设置一个图像以匹配我的页面高度减去顶部菜单 (50 像素)。另外,我正在使用twitter bootstrap 3,我知道它有img-responsive 类,这很棒,我想结合使用这个类来制作图像height=100%-50px

我该怎么做?

【问题讨论】:

  • 您最好的选择是使用 css3 calc(),尽管我不完全确定从百分比中减去一个平面像素值是否可行。如果有,请通知我(我们)! :)
  • @Applebough 它确实有效,但它存在一些问题,因为如果我调整浏览器大小,图像会稍微变形。

标签: html css twitter-bootstrap responsive-design fluid-layout


【解决方案1】:

如果您想将百分比与像素结合起来,您可以使用 css3 属性 calc():

height: calc(100% - 50px);

IE9+支持

【讨论】:

    猜你喜欢
    • 2018-04-19
    • 2016-05-20
    • 1970-01-01
    • 2011-05-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多