Use the HTML <img> tag as a background image instead of the CSS background-image property? -
i need use html <img> tag background image <div>. placing <p> of content on this. i've tried cant seem them display correctly. i've used position relative, margin negative values.
any suggestions or point me in right direction appreciated.
<div> <img src="http://www.shiaupload.ir/images/77810787432153420049.png" /> <p> lorem ipsum dummy text of printing , typesetting industry. lorem ipsum has been industry's standard dummy text ever since 1500s, when unknown printer took galley of type , scrambled make type specimen book </p> </div>
to make duplicate of features used background-image, we've consider features of img include:
- it doesn't have pointer events.
- it's rendered @ least 1 layer below
div.
the result be, this jsfiddle:
div { display: inline-block; overflow: hidden; position: relative; width: 100%; } img { pointer-events: none; position: absolute; width: 100%; height: 100%; z-index: -1; } you might modify width , height needs.
Comments
Post a Comment