代码:
<html>
<head>
<style>
#example1 {
background-image: url(img_flwr.gif), url(paper.gif), url(flower.gif);
background-position: right bottom, left top;
background-repeat: no-repeat, repeat;
padding: 100px;
}
</style>
</head>
<body>
<div id="example1">
</div>
</body>
</html>
在这里，我使用了三个背景图像，即 img_flwr.gif、paper.gif、flower.gif。我想使用 css 滑动这些图像。我不想让这些图像褪色。那么，我该怎么做呢？
最佳答案
创建一个图像元素并使用 position: absolute 和 z-index CSS 属性将图像设置在另一个元素后面。然后用 JQuery 制作你的 slider 。
<html>
<head>
<style>
#example1 {
background-position: right bottom;
background-repeat: no-repeat, repeat;
padding: 100px;
z-index: 10;
}
#slider {
position: absolute;
z-index: 0;
}
</style>
</head>
<body>
<div id="example1">
</div>
<div id="slider">
<img src="flwr.jpg" alt="Paris">
<img src="paper.jpg" alt="Paris">
<img src="flower.jpg" alt="Paris">
</div>
<script>
</script>
</body>
</html>
关于javascript - 我们如何使用 css 将 slider 设置为背景图片？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42665653/