Question

.row {
    margin-bottom: 0px;
}

没有被应用但是当我删除第二个媒体查询时呢？

默认设计是桌面，现在尝试实现移动设备和平板电脑。

body {
  background-image: url('../images/iStock-527528428 Cropped.jpg');
  background-repeat: no-repeat;
  background-position: center top;
  /*background-attachment: fixed;*/
  color: white;
}
.container {
  width: 37%;
  background-color: black;
  background: rgba(0, 0, 0, 0.67);
  border-radius: 17px;
  padding: 17px;
  position: relative;
  top: 37px;
}
@media screen and (max-width: 600px) {
  .container {
    width: 85%;
    top: 24px;
  }
  body {
    background-position: left top;
  }
}
@media screen and (min-width: 601px) and (max-width: 992px) {
  .container {
    width: 55%;
    top: 24px;
  }
}
.row {
  margin-bottom: 0px;
}
html {
  font-family: 'Nunito', sans-serif;
}

Answer 1

默认情况下，bootstrap在.row类底部没有边距。

媒体查询后样式未应用？

1 个答案: