所以在这里我有一个像下面这样的标题图片
我计划将标题图像拉伸到 100% 以获得显示器分辨率,实现这一目标的最佳实践和方法是什么?我试过这样做:
.LippoHeader
{
background-image: url('../images/body/headerpng_BG.png');
background-repeat: repeat-x;
width: 100%;
height: 170px;
}
.shadowone
{
width: 100%;
position: absolute;
left: -1px;
top: 172px;
display: inline-block;
}
.shadowtwo
{
width: 100%;
position: absolute;
left: -1px;
top: 173px;
display: inline-block;
}
.shadowthree
{
width: 100%;
position: absolute;
left: -1px;
top: 176px;
display: inline-block;
}
除非我添加:
位置:绝对;
有没有办法做到这一点?如果可能的话,我不想添加,我被告知不要将位置设置为绝对,因为这是一种不好的做法
这是标题的屏幕截图:
我也使用了母版页,所以没有正文标记,只有 div 标记,我使用 .ascx 作为面板标题,我的代码是
<div class="LippoHeader">
<div>
<img src="images/body/shadow.png" class="shadowone" />
<img src="images/body/shadow.png" class="shadowtwo" />
<img src="images/body/shadow.png" class="shadowthree" />
</div>
</div>