2

这个横幅居中，但我仍然想要左边的边距。我希望它在重新调整窗口大小后缩进，以便在较低分辨率和手机上看起来更好。

<div id="banner">
   <center>
      <a target="banner" href="index.html" >
        <img src="images/banner.jpg" border="0" alt="GamerZone Banner">
      </a>
   </center>
</div>

我也想使用 css 而不是 html center。谢谢。自从我一周前刚开始学习 HTML 以来，我不知道该怎么做。你能告诉我要尝试什么吗？

4

4 回答 4

4

您可以将填充添加到容器中，例如

#banner{
     padding:0 20px;
}
#banner img{
     display:block;
     margin:0 auto;
}
于 2013-03-06T13:56:40.943 回答
1

CSS：

#banner{
    width: 500px;
    height: 300px;
    margin:auto;
    text-align:center; /*centers horizontally*/
    line-height:300px; /*same as height and for centering vertically*/
}

<div id="banner">
 <a target="banner" href="index.html" title="some">
  <img src="images/banner.jpg" border="0" alt="GamerZone Banner">
 </a>
</div>

希望这有效。检查这个jsfiddle：http: //jsfiddle.net/ACuKe/1/

于 2013-03-06T13:49:51.317 回答
1

只需给出这种风格即可达到您的要求，

div#banner
{
  margin:0 auto;
  height: 100px;    //your own height
  width: 100px;    //your own width
}

无论屏幕分辨率如何，这将使您的 div 始终处于中心位置。看这里。

于 2013-03-06T13:53:36.697 回答
0 
<div id="banner" style="text-align:center; margin:0 auto;">
<a target="banner" href="index.html" style="display:block; text-indent:30px;"><img src="images/banner.jpg" border="0" alt="GamerZone Banner"></a></div>

将元素的边距属性设置为“0 auto”（“margin-top:0; margin-right:auto; margin:bottom:0; margin-left:auto;”的简写）加上“text-align:center” .

然后你可以给元素一个固定的“文本缩进”（用于单行内容）或一个固定的“左边距”。

于 2013-03-06T14:12:00.807 回答