CSS多图像背景行？

我做了一个搜索，无法找到我的特定查询的答案...承认这可能是由于我的新手能力和有缺陷的想法。我试图完成的是两行3个非平铺，不重复的并排图像......设置为我的网页背景。CSS多图像背景行？

下面是基本的HTML格式，我想复制一个CSS背景：

<HTML> 
<span><img src="images/image1.gif"><img src="images/image2.gif"><img src="images/image3.gif"><BR><img src="images/image4.gif"><img src="images/image5.gif"><img src="images/image6.gif"></span> 
<HTML>

这是我在一个CSS的解决方案原油尝试：

<style type="text/css"> 
body 
{ background-image: url('images/image1.gif'), url('images/image2.gif'), url('images/image3.gif'), url('images/image4.gif'), url('images/image5.gif'), url('images/image6.gif'); background-repeat: no-repeat; } 
</style>

这虽然“工作“......所有我设法做的是将6张图像直接堆叠在左上角。任何帮助newb将不胜感激。

谢谢！

来源

2013-03-06 user2138961

如果你知道每个图像的尺寸，你可以用'背景position'; – Passerby 2013-03-06 08:37:47

你可以使用你的HTML，但给'position：absolute'和'z-index：-1'作为背景。 – Zemljoradnik 2013-03-06 09:00:29

您需要明确地将background-position分配给每个背景图像。这应该适用于您的条件：

background-position: top left, top center, top right, bottom left, bottom center, bottom right;

也看看background-size css属性。

Working Fiddle

来源

2013-03-06 08:41:59

谢谢，我已经尝试过了，它确实将图像并排放置...但由于图像大小（350像素），每个图像之间存在巨大差距。我想让他们排成一行，没有空白。有没有办法用CSS来完成这个工作？ – user2138961 2013-03-06 14:19:08

@ user2138961正如我所提到的，看看'background-size'属性（查看我的更新后的链接）。或者做一些计算来使其合适。 :)。 – 2013-03-06 15:14:46

CSS多图像背景行？

回答

相关问题