我想在H1标签后面显示图像,我也希望图像宽度可以拉伸到与文本相同的宽度。
我的代码:
<div style="display: inline;">
<img src="http://img585.imageshack.us/img585/3989/m744.png" width="100%" height="68" />
<h1 style="position: absolute; top: 0px;">Variable length text</h1>
</div>
JSFiddle:http : //jsfiddle.net/Aykng/
当前外观:
所需外观:
图像宽度应拉伸或缩小以填充div,如何实现呢?
我希望它与IE 7+兼容,否则我将只使用background-image
和background-size
。
只需添加一些基本位置,即可轻松完成此操作
演示jsFiddle
div {
position: relative;
}
h1 {
display: inline;
}
img {
position:absolute;
width:100%;
max-width: 100%;
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句