固定背景附件

Question

所以我知道修复背景附件是方法。但是对于手机，背景会放大并且看起来很糟糕。因此，我必须为手机使用初始的背景附件。

问题是我的标题在手机上的位置是固定的，所以我必须在所有内容上添加margin top：100px。这包括背景，所以我尴尬地停在了所有这样的页面的顶部背景：

Awkward background

有什么办法解决这个问题？我很想使用固定在手机上的背景附件，但是据我所知，这是行不通的。

html, body {
font-family: 'Montserrat', sans-serif;
margin: 0px;
padding: 0px;
height: 100%;
background-image: url(../Bilder/paper.jpg);
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
-webkit-background-attachment: fixed;
-moz-background-attachment: fixed;
-o-background-attachment: fixed;
background-attachment: fixed;
color: black;
}



@media screen and (max-width: 640px) {
html, body {
 -webkit-background-attachment: initial;
-moz-background-attachment: initial;
-o-background-attachment: initial;
background-attachment: initial;
}
}

.everything {
min-height: 100%;
margin-bottom: 60px;
}


@media screen and (max-width: 640px) {
.everything {
margin-top: 130px;
 }
}

所以我知道修复背景附件是方法。但是对于手机，背景会放大并且看起来很糟糕。因此，我必须为手机使用初始的背景附件。问题是...

Answer 1

您应该将background-size CSS用于相关