Skip to main content

Hur och när du ska använda Iframes (Inline Frames)

“180” Movie (Maj 2025)

“180” Movie (Maj 2025)
Anonim

Inline-ramar, vanligtvis bara refererade till som "iframes", är den enda typen av ram som tillåts i HTML5. Dessa ramar är i huvudsak en del av din sida som du "skar ut". I det utrymme som du har klippt ut på sidan kan du sedan mata in en extern webbsida. I grund och botten är en iframe ett annat webbläsarfönster som sitter precis inuti din webbsida. Du seecode iframes vanligtvis används på webbplatser som måste inkludera externt innehåll som en Google-karta eller en video från YouTube. Båda dessa populära webbplatser använder iframes i deras inbäddningskod.

Hur man använder IFRAME-elementet

Elementet använder de globala elementen HTML5 och flera andra element. Fyra är också attribut i HTML 4.01:

  • -Adressen för källan till ramen
  • -Höjden på fönstret
  • -Fönstrets bredd
  • -Namnet på fönstret

Och tre är nya i HTML5:

  • srcdoc-Ht HTML för källan till ramen. Detta attribut har företräde framför alla webbadresser i src attribut
  • sandlåda-En lista över funktioner som ska tillåtas eller otillåtna i ramfönstret
  • sömlös-Talar användaragenten att iframe ska göras som att det är osynligt del av moderdokumentet

För att skapa en enkel iframe ställer du in källadressen och bredden och höjden:

Observera att du kan välja att inte använda pixelvärden för inställningarna för din iframe, men kan istället välja att använda en procentandel. Om du bygger en mottaglig webbplats vars storlek ska ändras med olika skärmstorlekar, kommer dessa procentsatser att vara viktiga.

Det finns också några attribut som är giltiga i HTML 4.01 men föråldrade i HTML5. Eftersom de flesta webbplatser idag använder HTML5 +, är dessa attribut som du inte vill använda (men som du kan se i några äldre dokument).

  • - använd istället en en element för att länka till en beskrivning
  • - använd istället CSS flyta fast egendom
  • allowtransparency- använd istället CSS bakgrund egendom för att göra iframen öppen
  • - använd istället gräns CSS-egenskapen
  • marginheight- använd istället CSS marginal fast egendom
  • marginwidth- använd istället CSS marginal fast egendom
  • - använd istället CSS svämma över fast egendom

IFRAME Browser Support

De IFRAME elementet stöds av alla moderna webbläsare:

  • Android
  • Krom
  • Firefox
  • Internet Explorer 2+
  • iOS / Safari Mobile
  • Netscape 7+
  • Opera 3+
  • Safari

Om inget versionsnummer visas i listan ovan beror det på att alla versioner av den webbläsaren stöder den.

En sak att vara uppmärksam på är att medan alla webbläsare stöder IFRAME element finns det fortfarande begränsat stöd för några av HTML5-funktionerna.

  • Använder sig av svämma över att stänga av rullning är inte tillförlitlig. Om du inte vill ha rullfält på dina iframes, bör du fortsätta använda rullning attribut.
  • De srcdoc, sandlåda, och sömlös attribut stöds inte av några webbläsare just nu.

Länkar med Iframes

När du ger dina iframes a namn eller id Du kan sedan peka dina länkar i den ramen med attributet på en element. Då, när en användare klickar på länken, öppnas den inom den refererade iframen istället för det aktuella fönstret.

Prova själv. Skriv följande på en webbsida:

id = "myIframe" src = "http://webdesign.about.com/#lp-main" height = "200px" width = "500px">

Detta är min iframe

När du klickar på den här länken öppnas ett nytt dokument i fönstret ovan.

Om dokumentet öppnas i IFRAME har inga mål inställda, då alla länkar öppnas i samma iframe som moderdokumentet.

Du kan använda den här funktionen för att skapa länkar i en IFRAME ändra innehållet i en annan IFRAME på samma sida.

IFram och säkerhet

De IFRAME element i sig är inte en säkerhetsrisk för dig eller dina läsare. Tyvärr har iframes fått ett dåligt rykte eftersom de kan användas av skadliga webbplatser för att inkludera innehåll som kan infektera en besökares dator utan att de ser den på sidan. Detta görs genom att ha länkar pekar mot det osynliga IFRAME och dessa skript avstänger skadlig kod. Användaren klickar på länken och tycker att länken är trasig eftersom ingenting verkade hända, men ett manus satt av där de inte kunde se det.

Det finns också datavirus som kommer att injicera en osynlig IFRAME in på dina webbsidor, vilket gör att din webbplats blir en botnät. De kan göra detta genom SQL-injektion och andra attacker.

Saken att komma ihåg när man inkluderar en IFRAME På din webbsida är det att dina användare är lika säkra som innehållet på alla webbplatser du länkar till. Om du har anledning att känna en webbplats är otillförlitlig, koppla inte till det på något sätt och helt klart inte inkludera innehållet i en IFRAME. Att länka till dina egna sidor inom iframes utgör emellertid inte någon säkerhetsrisk för dig eller dina användare.

Originalartikel av Jennifer Krynin. Redigerad den 11/7/16 av Jeremy Girard