I have a iframe on my page. I have inserted a background image on it. but its not showing the Image. Here is my code.
<iframe scrolling="auto" allowtransparency="true" name="main" style="width:100%;height:90%" style="background-image:url(img/bg2.jpg)"> </iframe>
An image can be added using “img” tag, and webpages and videos can be embedded by using the “iframe” tag with proper size settings. The “src” attribute is needed while using these tags. You can assign the image, video, or URL link of a webpage to “src” attribute.
The <iframe> tag is an inline frame. It is used to embed another HTML page within the current HTML page. A transparent iframe can be made by setting its background to transparent. And, the allowtransparency attribute of “iframe” is to be set as “true”.
Say you want to put an image or two on a webpage. One way is to use the background-image CSS property. This property applies one or more background images to an element, like a <div> , as the documentation explains.
Try this:
<iframe scrolling="auto" allowtransparency="true" name="main" style="width:100%;height:90%;background-image:url(img/bg2.jpg)"> </iframe>
if it doesn't work move the background images to the container of the iframe.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With