背景图片截断了 bootstrap 中的文本

Question

当屏幕尺寸调小时，我的背景图片会截断我的文字。在大屏幕上查看时，背景图像也不是屏幕高度的 100%。我做错了什么？

    .slider {
    background: url("../images/bg2.jpg") no-repeat center center fixed;
    background-size: cover;
    max-height: 1200px;
    height: 100%;
    width: 100%;
    overflow: hidden;

-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
}

Answer 1

为 .slider class 添加 min-height:100% 并为其父 body 标签添加 height: 100%。删除 .slider class 中的 width, overflow, height。

应该是-

body {
  height: 100%;
}

.slider {
  background: url("../images/bg2.jpg") no-repeat center center fixed;
  -webkit-background-size: cover;
    -moz-background-size: cover;
      -o-background-size: cover;
         background-size: cover;

  min-height: 100%;
}

背景图片截断了 bootstrap 中的文本

background image is cutting off text in bootstrap

html

css

twitter-bootstrap

responsive