Question

以下是代码：

    <style type="text/css">
    body { background: #0c2660; padding: 0px; margin: 0 auto; width: 550; align: center;}
    .logo {text-align: center; margin: 90px 0;  position: relative;}
    .mapper {margin: 0; position: relative;}
    #back { background: #0c2660 url('back.jpg') no-repeat; margin: 0px; width: 1024; height: 768px; text-align: center;}
</style>

和有图像地图的html

<div id="back">
<div class="logo"><img src="logo.png" width="331" height="74" border="0" alt="" /></div>
<div class="mapper"><img src="greece.png" width="550" height="500" border="0" usemap="#map" class="mapper iborder00aa00 icolor00ff00" alt="" />
<map name="map"></map>
</div>
</div>

只有徽标图像在中心对齐，无论我改变什么，背景图像和greece.png都会左对齐

Answer 1

您可以从<div id="back">移除宽度以使其位于中心

Answer 2

body { 
   background: #0c2660; 
   padding: 0px; 
   margin: 0 auto; 
   width: 1024px;
} 
.logo { 
   text-align: center; 
   margin: 90px 0; 
   position: relative; 
}
#mapperi { 
   margin-left: 240px; 
   position: relative; 
   align: middle;
}
#back { 
   background: #0c2660 url('back.jpg') no-repeat; 
   margin: 0px; 
   height: 768px; 
   text-align: center;
}

是最终解决方案：）

对齐在三个元素中只有一个是正确的

2 个答案: