我将内容设置为 1024px 宽度并与中心对齐。现在我想要在左侧的横幅。因为横幅可以有不同的大小,所以我必须将横幅对齐到右侧。横幅用锚包裹着。在下面的示例中,我使用了 div 而不是图像。
HTML:
<div id="content">
<div id="banner">
<a href="#"><div id="background">banner</div></a>
</div>
<div id="maincontent">
SSSSSSSSSSSSSSSSSSSSSSSSS
OOOOOOOOOOOOOOOOOOOOOOOOO
MMMMMMMMMMMMMMMMMMMMMMMMM
EEEEEEEEEEEEEEEEEEEEEEEEEEE
CCCCCCCCCCCCCCCCCCCCCCCCC
OOOOOOOOOOOOOOO
NNNNNNNNNNNNNNNNNNNNNNN
TTTTTTTTTTTTTTTTTTTTT
EEEEEEEEEEEEEEEEEEEEE
NNNNNNNNNNNNNNNNNNNNNNNNNN
TTTTTTTTT
</div>
</div>
CSS:
#content {
width: 400px;
margin: 0 auto;
background-color: red;
position: relative;
}
#background {
width: 20px;
height: 100px;
background-color: blue;
color: white;
}
#banner{
position: absolute;
left: -200px;
width: 200px;
height: 100px;
background-color: yellow;
text-align: right;
}
text-align: right;
没有成功。