我是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>
最佳答案
.bruceBanner
是div
元素。
默认情况下,div
元素是块级元素,这意味着它们占用100%的宽度。
您需要将宽度设置为小于100%或将其display
更改为inline-block
。
.bruceBanner {
margin: 0 auto;
width: 50%;
}