Learn HTML step-by-step from A to Z or improve your professional skills.  Home HTML and CSS Tutorials Transparent IFrames
Your Ad Here

Transparent IFrames


If you don't already have a bsic knowledge of IFrames, click here. OK, let's get started! To make the backgrounds on your IFrames transparent, copy the code below.

<div style="position: absolute; top:300; left:400"> <IFRAME src="/img_articles/1420/PAGEURL.htm" name="frame" width="200" height="200" frameborder="0" allowtransparency="true"></iframe></div>

Edit all of the numbers. The width and height determine how big your IFrame will be. The top and left numbers determine where the IFrame will be placed on your site. The larger the number for the top position is, the further down it will go. The larger the left number is, the further right it will go. Keep altering these numbers until you are happy with them. You also must change PAGEURL.htm to the url of your IFrame. Now copy the code below, and paste it into the <head>  tag of the page you are linking to (in other words the page that you replaced PAGEURL.htm with).

<style> <!-- BODY { background-color: transparent; } --> </style>

Transparent iframe example
Transpafent IFrame example


Author's URL: Lindsay Coome
Thank you for voting.
Rate this Materials:
Bad 
1 2 3 4 5 Excellent
print this page subscribe to newsletter subscribe to rss

HTML is Hyper Text Markup Language that is used to make hypermedia and hypertext documents for the Web. More HTML and CSS: Most Popular Materials | Fresh Materials | More HTML Tutorials at Markuptutorials.com

Add comments to "Transparent IFrames"

Only registered users can write comment

Reader's comments