如何将 css 中的云图像彼此分开放置？

Question

大家好，我现在被困在同一个位置上了。我有一个云应该在的位置，但另一个云不在它应该在的位置，我无法将它放到网页上我想要的位置。而不是它就在我的另一朵云上。我希望小云在页面的右侧。谁能帮帮我？

CSS

  @charset "utf-8";
  /* CSS Document */


  /*This is for the fresh farms and clouds image*/
  body
  {
  background-image: url("Image/cloud.png"),url("Image/cloud.png"), 
  url("Image/FreshFarmsBG.jpg");
  background-repeat: no-repeat;
  background-size: 10%,20%, cover;
  background-position: top right, top left, cover;

    height: auto;

    }

Answer 1

背景位置值应该在每个值之间有一个连字符，这样就可以了

background-position: top-right, top-left, cover;

编辑：您可以做的是将背景设置为仅 1 张图像所以会是

background-image:url("Image/FreshFarmsBG.jpg");

然后在 .html 文件中，您可以使用 img 标签添加 2 个新元素，并使用

float: left

第一张图片的属性，以及..

float: right

在 css 文件中的第二张图片上，不要忘记给每张图片一个单独的 class，这样您就可以分别定义每张图片。例如：

img .cloud1{
  float: left
}

img .cloud1{
  float: right
}

如何将 css 中的云图像彼此分开放置？

How to position my clouds images in css away from each other?

css

css-animations