logo

HTML iframes

HTML Iframe används för att visa en kapslad webbsida (en webbsida på en webbsida). HTML

En HTML-iframe bäddar in ett annat dokument i det aktuella HTML-dokumentet i det rektangulära området.

Webbsidans innehåll och iframe-innehåll kan interagera med varandra med hjälp av JavaScript.

jquery förälder

Iframe-syntax

En HTML-iframe definieras med

 <iframe src="URL"></iframe> 

Här anger 'src'-attributet webbadressen (URL) för den inbyggda ramsidan.

Ställ in bredd och höjd på iframe

Du kan ställa in bredden och höjden för iframe genom att använda attributen 'width' och 'height'. Som standard anges attributvärdena i pixlar men du kan också ställa in dem i procent. dvs 50%, 60% osv.

Exempel: (Pixlar)

 <h2>HTML Iframes example</h2> <p>Use the height and width attributes to specify the size of the iframe:</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Testa det nu

Exempel: (Procentandel)

 <h2>HTML Iframes</h2> <p>You can use the height and width attributes to specify the size of the iframe:</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Testa det nu

Du kan också använda CSS för att ställa in höjden och bredden på iframen.

Exempel:

 <h2>HTML Iframes</h2> <p>Use the CSS height and width properties to specify the size of the iframe:</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Testa det nu

Ta bort kanten på iframe

Som standard innehåller en iframe en ram runt den. Du kan ta bort gränsen genom att använda attribut och CSS-gränsegenskap.

Exempel:

 <h2>Remove the Iframe Border</h2> <p>This iframe example doesn&apos;t have any border</p> <iframe src="https://www.javatpoint.com/"></iframe> 
Testa det nu

Du kan också ändra storlek, färg, stil på iframens kant.

namn på specialtecken

Exempel:

 <h2>Custom Iframe Border</h2> <iframe src="https://www.javatpoint.com/"></iframe> 
Testa det nu

Iframe-mål för en länk

Du kan ställa in en målram för en länk genom att använda iframe. Ditt angivna målattribut för länken måste referera till namnattributet för iframen.

Exempel:

 <h2>Iframe - Target for a Link</h2> <iframe src="new.html" name="iframe_a"></iframe> <p> <a href="https://www.javatpoint.com">JavaTpoint.com</a> </p> <p>The name of iframe and link target must have same value else link will not open as a frame. </p> 
Testa det nu

Produktion

HTML iframes

new.hmtl utdatakod:

 p{ font-size: 50px; color: red;} <p>This is a link below the ifarme click on link to open new iframe. </p> 

Bädda in YouTube-video med iframe

Du kan också lägga till en YouTube-video på din webbsida med hjälp av

Följande är några steg för att lägga till YouTube-video på din webbsida:

  • Gå till YouTube-videon som du vill bädda in.
  • Klicka på DELA ➦ under videon.
  • Klicka på alternativet Bädda in.
  • Kopiera HTML-kod.
  • Klistra in koden i din HTML-fil
  • Ändra höjd, bredd och andra egenskaper (efter krav).

Exempel:

 <iframe src="https://www.youtube.com/embed/JHq3pL4cdy4" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe> <iframe src="https://www.youtube.com/embed/O5hShUO6wxs" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture">></iframe> 
Testa det nu

Produktion:

tostring metod java
HTML iframes

Attribut av

Attributnamn Värde Beskrivning
tillåt helskärm Om det är sant kan den ramen öppnas i helskärm.
höjd Pixels Den definierar höjden på den inbäddade iframen, och standardhöjden är 150 px.
namn text Det ger namnet till iframen. Namnattributet är viktigt om du vill skapa en länk i en ram.
ramkant 1 eller 0 Den definierar om iframe ska ha en kantlinje eller inte. (Stöds inte i HTML5).
Bredd Pixels Den definierar bredden på den inbäddade ramen och standardbredden är 300 px.
src URL Attributet src används för att ge sökvägsnamnet eller filnamnet vilket innehåll som ska laddas in i iframe.
sandlåda
Det här attributet används för att tillämpa extra begränsningar för innehållet i ramen
tillåta-formulär Det tillåter inlämning av formuläret om detta nyckelord inte används blockeras formulärinlämning.
tillåt popup-fönster Det kommer att aktivera popup-fönster, och om det inte tillämpas öppnas inget popup-fönster.
tillåt-skript Det gör att skriptet kan köras.
tillåt-samma-ursprung Om detta nyckelord används kommer den inbäddade resursen att behandlas som nedladdad från samma källa.
srcdoc Attributet srcdoc används för att visa HTML-innehållet i den inline-iframe. Det åsidosätter src-attributet (om en webbläsare stöder det).
rullning
Det indikerar att webbläsaren ska tillhandahålla en rullningslist för iframe eller inte. (Stöds inte i HTML5)
bil Rullningslisten visar bara om innehållet i iframe är större än dess dimensioner.
ja Visar alltid rullningslisten för iframe.
Nej Visar aldrig rullningslist för iframe.