html - div HTML 中的较小元素

Question

我的 div 中有许多图像，我将它们放置在其中，以便彼此完整。我还需要，当我将 div 复制到其他页面时，图像的样式相同，但我可以修改将 div 放在我的页面中的位置现在我的问题是：我希望 div 内的这些整体图像更小并且每个图像仍然完整我的代码的其他示例：

    <div style="position:absolute; top:900px; left:500px" >
      <img id="Burimi" style="position:absolute; left:10px" src="Images/Reagion/Burimi-B.png"/>
        <img id=""  style="position:relative; left:98px;top:1px;" src="Images/Reagion/N Batinah-B.png" />

      </div>

例子：

Answer 1

您可以调整容器而不是图像的大小。例如，您可以对 parent 使用以下内容div：

div {
transform: scale(.5,.5); /*Half width and height */
-ms-transform: scale(.5,.5); /* IE 9 */
-webkit-transform: scale(.5,.5); /* Safari and Chrome */
-o-transform: scale(.5,.5); /* Opera */
-moz-transform: scale(.5,.5); /* Firefox */
} 

Answer 2

听起来你最好使用image map. 让一张图像包含您希望它们显示在页面上的所有图像，然后用于areas区分图像上的不同区域。

Answer 3

用于position:relative,div和position:absolute用于所有图像。

这样，您可以将 div 放在任何地方，并且图像将始终相对于div