在调整窗口大小时，将某些图像设置在屏幕行中间

Setting some images in the middle of a screen- row, while resizing window

本文关键字：图像 设置 屏幕 中间 窗口 调整 小时      更新时间：2023-09-26

我为移动设备构建了一个HTML网站，因此每个设备上的窗口更改的width，我试图在行中间显示2个图像-在标题位置，因此图像之间会有一点空间，而调整窗口大小时，我希望这2个图像自动移动并保持在行中间相同的空间。我试了一些代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<style>
#box {
  width: 55%;
  padding-left: 45%;
}
.imgSize {
  width: 150px;
  height: 150px;
}
</style>
<div id="box">
<div id="img1"> <image src = "http://icons.iconarchive.com/icons/sniffels/christmas/256/house-icon.png" class="imgSize"></div>
<div id="img2"> <image src ="http://icons.iconarchive.com/icons/archigraphs/collection/256/House-icon.png" class="imgSize"></div>
</div>
</html>

但结果是一个图像覆盖了另一个图像，或者图像被窗户覆盖了…有什么想法吗?

Mr.Alex.

试试这个. . 

    #box {
    width: 100%;
    text-align:center;
    background-color:#000;
    }
    .imgSize {
    width: 150px;
    height: 150px;
    align:center;
    }

也看一看http://jsfiddle.net/7nJND/，并在中间拖动(8个html或Javascript)和Result。你可以在中间看到你的图像。

祝你好运

相关文章：