如何格式化背景图像HTML有关大小和重复

Question

我目前正在从事一个学校项目，我们的任务是建立网站。我试图使背景图像保持特定尺寸，无论屏幕尺寸如何，使图像垂直重复。

我看上去很广泛地试图找到这个问题的答案，找不到任何帮助的东西 - "我的唯一希望"

我是堆栈溢出的新手，所以我希望我已经正确格式化了。谢谢 - dh

示例：

body {
    background-image: url("background.png");
    background-size: auto;
    background-position: auto;
    background-repeat: no-repeat;
    background-repeat: repeat-y;

Answer 1

您可以使用background-size属性为背景应用大小，并且可以通过CSS使用background-repeat属性重复背景。例如，查看以下片段。图像的原始大小约为3264x2448。但是我已经在代码150x100中提到，并使用repeat-y属性垂直重复图像。我已经为身体元件应用了整个背景，并将其水平对齐和垂直中心。

body {
  background-image:url("http://myanmareiti.org/sites/default/files/sample-5_0.jpg");
  background-repeat:repeat-y;
  background-size:150px 100px;
  background-position:top center;
}

<div>
Something HRere
</div>

Answer 2

尝试此CSS：

 background-image: url("path/image.jpg");
 background-repeat: repeat-y;
 background-size: cover;

背景重复在您需要的情况下垂直重复Y图像，这将在您的页面上垂直重复图像，并且背景大小属性可以占据。覆盖，像素或百分比的值。我认为您应该以％的百分比来适合您的屏幕尺寸。