我正在尝试将居中图片附加到它后面的黑色div上,但是如果您将窗口缩小(窗口宽度较小),则黑色div会变小,并且在图片的左上角和右上角与黑区 它不会在div附近保持固定。
我该如何解决?谢谢你。请以整页形式查看,然后以小页形式查看。在此处查看示例:
.f-content {
margin-top: 5%;
text-align: center;
display: inline-block;
width: 100%;
background-color: #1C2431;
}
<div class="f-content">
<div style="float: left; color:white;">FOOTER LEFT</div>
<img src="http://curier.cumparamlaptopuri.ro/1.png" alt="" width="40%" height="auto" style="margin-top: -26px; position: inherit;" />
<div style="float: right;color:white;">FOOTER RIGHT</div>
<div style="clear: right;"></div>
</div>
我可以建议这样的事情吗:
.f-content {
margin-top: 5%;
text-align: center;
display: inline-block;
width: 100%;
background-color: #1C2431;
position: relative;
}
img {
position: absolute;
margin: 0 auto;
left: 0;
right: 0;
margin-top: -1.9%;
}
<div class="f-content">
<div style="float: left; color:white;">FOOTER LEFT</div>
<img src="http://curier.cumparamlaptopuri.ro/1.png" alt="" width="40%" height="auto">
<div style="float: right;color:white;">FOOTER RIGHT</div>
<div style="clear: right;"></div>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句