0

我在主页上有一个大标题图片。我设法使图像在移动版本中响应，但我很难管理底部之后按钮和文本之间的空间。每个移动屏幕的空间都不相同。有时空间更大。

如何解决这个问题？您可以在此处查看移动版本

CSS（移动版图片标题的 CSS 之一）

@media (max-width: 520px) {
  .home-header-div {
    height: 750px;
  }
  .home-header-h1 {
    font-size: 2em;
    text-align: left !important;
    width: 100% !important;
    margin: 0.75em 0 0 0 !important;
    padding-left: 0.35em !important;
  }
  .home-header-h3-mv {
    padding: 8em 0.75em 0 0.75em;
    display: block;
    line-height: 1.25em;
    font-weight: 300;
    font-size: 1em;
  }
  .home-header-button {
    font-size: 1em;
    top: 33em;
    position: absolute;
    float: none;
    margin: 0 auto;
    display: block;
    text-align: center;
    width: 90% !important;
    line-height: 1.20em;
  }
  .home-header-p-mv {
    margin: 27em auto;
    font-size: 1em;
  }
}
 <a class="button-125em button-all home-header-button" href="/calculate-your-loan/" target="_blank"><span class="calculator">Calculate your loan now</span></a>

4

1 回答 1

-2

尝试使用%而不是em. em单位应该由字体相对大小使用。如果您将它用于填充/边距，它在各种设备上效果不佳。

看一看：为什么用 em 而不是 px？

于 2016-06-07T06:28:02.740 回答