我在網頁上使用了一個背景圖片，並在css中使用了這個代碼，這使得在瀏覽器調整大小時可以很好地調整大小。當瀏覽器調整大小時，CSS圖像變得更小
body{
background: url("images/back.jpg") no-repeat ;
background-size: cover;
}
我需要放置在背景圖像上的一些其他圖像的特定位置（上表的花瓶）。但，當我這樣做，那麼後臺獲取大小，但花瓶形象留在同一個地方，調整瀏覽器大小時的大小相同，如下面的第二張圖所示。
看到了花瓶這兩個圖像
我怎樣才能讓這個花瓶形象也得到調整大小就像背景
嘗試使圖像的相對位置和手動設置對齊。
<head>
<style>
body {
background: #000000;
}
#image1 {
background: #008000;
position: relative;
left: 50px;
height: 50px;
width: 50px;
}
</style>
</head>
<body>
<div id="image1"></div>
</body>
我最近碰到了一模一樣的問題創建一個隱藏的OBJ ect遊戲需要放置在背景圖像頂部的圖像以保持其位置，而不管瀏覽器尺寸如何。
這裏就是我所做的：
可以包括背景圖像的模板版本作爲實際<img>與visibility:hidden（所以它是不可見的，但仍然佔據了它的空間在DOM和基本尺寸（和背景圖像的大小）的基礎上該
HTML：
<div class="image-container">
<img src="http://www.w3.org/html/logo/downloads/HTML5_Logo_512.png" class="img-template">
<div class="item"></div>
</div>
CSS：
/* This is your container with the background image */
.image-container {
background:url('http://www.w3.org/html/logo/downloads/HTML5_Logo_512.png') no-repeat;
background-size:100%;
overflow-x: hidden;
position:relative;
}
/* This is the template that resizes the DIV based on background image size */
img.img-template {
visibility: hidden;
width:100%;
height:auto;
}
/* This is the item you want to place (plant pot) */
.item {
position: absolute;
left: 14.6%;
bottom: 80.3%;
width: 15%;
height: 15%;
background: yellow;
border: 2px solid black;
}
這裏是一個工作示例：http://jsfiddle.net/cfjbF/3/
您使用的是你的形象是什麼CSS？ –
將兩幅圖像組合成一幅圖像如何？ –
比利有一個鼠標懸停，它改變了花瓶的顏色，這就是爲什麼它必須是另一個圖像 – JanetOhara