Remove border from IFrame using CSS

The Iframe is used to display a web page on the webpage. Remove border from iframe tag in the webpage could be done by using one of the CSS properties of the iframe tag called frameBorder and set its value to “0”.

Syntax:

frameBorder = "value";

Note: In the frameBorder property the B letter must be in capital otherwise it will not be recognized by the browser. The value taken by the frameBorder property are 0 and 1, where 0 is used to disable the border and 1 is used for enabling the border property. By default, the value is set to 1.



Example 1:

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
    <head>
        <title>Disable Iframe Border</title>
        <style>
            iframe {
                height:200px;
                width:400px;
                background-color:lightgreen;
            }
            h1 {
                color:green;
            }
            body {
                text-align:center;
            }
        </style>
    </head>
    <body>
        <h1>GeeksforGeeks</h1>
        <h2>iframe border property</h2>
  
        <!-- We do not use border by specifying value 0 -->
        <iframe src=# frameBorder="0"></iframe> 
    </body>
</html>                    

chevron_right






                        filter_none








Output:




Example 2:











                                    filter_none




                                    edit

                                    close




                                    play_arrow




                                    link

                                    brightness_4

                                    code
                                




















<!DOCTYPE html> 


<html> 


    <head> 


        <title>Disable Iframe Border</title> 


        <style> 


            iframe { 


                height:200px; 


                width:400px; 


                background-color:green; 


            } 


            h1 { 


                color:green; 


            } 


            body { 


                text-align:center; 


            } 


        </style> 


    </head> 


    <body> 


        <h1>GeeksforGeeks</h1> 


        <h2>iframe border property</h2> 


  


        <!-- We use border by specifying a non-zero value -->


        <iframe src=# frameBorder="1"></iframe>  


    </body> 


</html>                     



















                        chevron_right







                        filter_none








Output:





          
          
          
          

            

    

        My Personal Notes
        arrow_drop_up
    

    

        
        

            
            
        

    


Recommended Posts:
RahulRanjan4
A tech fanatic who can code stuff
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on  the "Improve Article" button below.


      
      
      
      

      

      
					
		

    Article Tags : 
CSS
HTML
Web Technologies

           	
Practice Tags : 
HTML

        

         

         
 
         
        Be the First to upvote.

                

        



        
        
        
        
        

    

            

            0
            

            

                             No votes yet.
                    

            
            
            
            
            
        

        
        

        

        

        

        

        

        


Please write to us at contribute@geeksforgeeks.org to report any issue with the above content.