How to remove Iframe Border - HTML Iframes

By default, an iframe has a border around it.

Full Example of Remove Iframe Border

To remove the border, add the style attribute and use the CSS border property:

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h2>Remove the Iframe Border</h2>
<p>To remove the default border of the iframe, use CSS:</p>

<iframe src="https://itupto.com" style="border:none;" title="Iframe Example"></iframe>

</body>
</html>

Output should be:

Full Example of Custom Iframe Border with CSS

With CSS, you can also change the size, style and color of the iframe's border:

index.html

Example: HTML

<!DOCTYPE html>
<html>
<body>

<h2>Custom Iframe Border</h2>
<p>With CSS, you can also change the size, style and color of the iframe's border:</p>

<iframe src="https://itupto.com" style="border:2px solid red;" title="Iframe Example"></iframe>

</body>
</html>

Output should be:

Category:	Web Tutorial
Sub Category:	HTML Iframes
Uploaded by:	Admin

Read Article
https://develop.horje.com/learn/1434/reference