垂直半页背景图像（在 Squarespace 中）

Question

我正在寻找像这样的半页背景图片：www.washiarts.com。我使用 Squarespace 来构建网站，因为我是网页设计的新手...请多多关照。

我知道我需要使用一个容器，然后在其中放置图像，尽管我在 Squarespace 中使用代码输入选项努力做到这一点。我可以放置图像并使用此代码的变体正确对齐它，但它看起来被拉伸了：

> body {
   background-image: url("IMAGE URL");
   background-position: 0;
   background-size: 50% 100%;
   background-repeat: no-repeat;
 }

感谢您的帮助。

Answer 1

我认为很难不让它伸展。 Washiarts.com 的背景图像也有轻微的拉伸。他们使用 background-size: cover;

制作一个可重复的图案并使其向下重复怎么样？

body {
   background-image: url("http://i285.photobucket.com/albums/ll53/ellee2012/Cute/0-75.png~original");
   background-size: 50%;
   background-repeat: repeat-y;
 }

垂直半页背景图像（在 Squarespace 中）

Vertical half page background image (in Squarespace)

css

background

image

squarespace