Question

仅使用css3 / html5，我试图将独立且不同的背景图像并排排列，而不是相互重叠。

本质上，我希望获得多个独立且不同的背景图像，以准确表现单个背景图像的平铺行为。

我也希望在不设置任何固定或特定位置的情况下实现此目的，只需将每个背景图像放在其旁边的背景图像的大小上，然后按下它，依此类推等等。

因此，背景图像正常地平铺在元素/容器上，除了平铺中的每个单独的背景图像都可以是唯一的。

有什么想法吗？

Answer 1

以下是我理解你的问题：

我有一些图片文件
我想并排显示它们
我有一个div，我不想（或不能）更改我的HTML

＆＃34;使用CSS3，可以我将这些图像并排显示为我的div的背景？＆＃34;

如果这是你的问题，答案是否定的，现在不是。遗憾。

根据此标准规范， http://www.w3.org/TR/2002/WD-css3-background-20020802/#properties4 没有位置值来放置背景图像＆＃34;之前的＆＃34;或者＆＃34;浮动＆＃34;。

有关多个背景和背景大小调整的更多信息： http://www.css3.info/preview/multiple-backgrounds/ https://css-tricks.com/almanac/properties/b/background-size/

你可能想要查看你的画廊的位置，一个包含你的img元素的div是绝对的。如果将它放在div之前，它将出现在div后面，并为每个图像文件创建一个img元素。

<div style="position:absolute;">
   <img src="image1.png">
   <img src="image2.png">
   <img src="image3.png">
</div>
<div>the div to be backgrounded</div>

Answer 2

foreach img你要在你的“背景”中使用，创建一个div，然后使用css background-image属性在div的边框内显示图像。换句话说，不要将img标签放在html中，链接到你的css中的源代码。没有定位，您将被限制为使用背景图像

添加任何“前景”内容到div

根据您提出问题的方式，这可能最终会让您感到非常耗时且令人沮丧。也许可以考虑使用您能理解的代码的不同技术？如果你从基础开始并彻底学习它们，那么创造性技术就会显露出来

是否可以平铺多个不同的背景图像？

2 个答案: