我是HTML和CSS的新手。

我正在尝试将横幅广告放在屏幕顶部。

我尝试将左右边距设置为自动,但是当我尝试将其左右对齐或text-align:center时,什么也没发生,所以我不确定为什么...

我将横幅放在div中。

<div class="bruceBanner">
 <a href="http://www.example.com">
    <img border="0" alt="XYZ Banner" src="http://www.fablevision.com/northstar/make/objects/banner3.gif" width="553" height="172">
</a>
</div>


并这样引用它的类。

.bruceBanner {
margin-left: auto;
margin-right: auto;
}


完整的html在下面,以防万一我不知道有什么错误。

<DOCTYPE HTML>
<html>
<head>
<link type="text/css" rel="stylesheet" href="stylesheet.css"/>
<title>XYZ Products</title>
<meta charset="utf-8"/>
 </head>

 <body>

 <div class="bruceBanner">
<a href="http://www.example.com">
    <img border="0" alt="XYZ Banner" src="http://bit.ly/1QSpdbq" width="553"    height="172">
</a>
 </div>



 </body>
 </html>

最佳答案

.bruceBannerdiv元素。

默认情况下,div元素是块级元素,这意味着它们占用100%的宽度。

您需要将宽度设置为小于100%或将其display更改为inline-block

.bruceBanner {
  margin: 0 auto;
  width: 50%;
}

10-07 17:35