Inline Frames vám umožní zahrnout obsah z externích zdrojů do vašich stránek
Inline frames, obvykle nazývané "iframe", jsou jediným typem rámce povoleným v HTML5. Tyto rámce jsou v podstatě část stránky, kterou vymažte. Na místě, které jste vynechali ze stránky, můžete poté napojit externí webovou stránku. V podstatě je iframe dalším oknem prohlížeče nastaveným přímo uvnitř vaší webové stránky. Vidíte, zda se rámce používají běžně na webech, které musí obsahovat externí obsah, jako je mapa Google nebo video z YouTube.
Obě tyto populární webové stránky používají prvky iframe ve svém kódu pro vložení.
Jak používat prvek IFRAME
Prvek používá globální prvky HTML5 i několik dalších prvků. Čtyři jsou také atributy v HTML 4.01:
- - adresa URL zdroje rámce
- - výška okna
- - šířku okna
- - název okna
A tři jsou nové v HTML5:
- srcdoc - HTML pro zdroj rámce. Tento atribut má přednost před libovolnou adresou URL v atributu src
- sandbox - seznam funkcí, které by měly být v okně rámečku povoleny nebo zakázány
- bezproblémová - vypovídá uživatelský agent, že iframe by měl být vykreslen, jako by byl neviditelně součástí nadřazeného dokumentu
Chcete-li vytvořit jednoduchý iframe, nastavte zdrojovou adresu URL a šířku a výšku:
Všimněte si, že se můžete rozhodnout nepoužívat hodnoty pixelů pro nastavení vašeho iframe, ale místo toho se může rozhodnout použít procento.
Pokud vytváříte citlivou webovou stránku, jejíž rozměry by se měly měnit v různých velikostech obrazovky, bude toto procento důležité.
Tam jsou také některé atributy, které jsou platné v HTML 4.01, ale zastaralé v HTML5. Vzhledem k tomu, že dnes většina webových stránek používá HTML5 +, jsou tyto atributy ty, které nechcete používat (ale které se mohou zobrazit v některých starších dokumentech).
- - namísto toho použijte prvek A k odkazu na popis
- - namísto toho použijte vlastnost floating CSS
- allowtransparency - namísto toho použijte vlastnost pozadí CSS pro vytvoření ifram transparentního
- -stejně použijte vlastnost hranice CSS
- marginheight - místo toho použijte vlastnost okraje CSS
- marginwidth - namísto toho použijte vlastnost okraje CSS
- - namísto toho použijte vlastnost přetečení CSS
Podpora prohlížeče IFRAME
Prvek IFRAME je podporován všemi moderními prohlížeči:
- Android
- Chrome
- Firefox
- Internet Explorer 2+
- iOS / Safari Mobile
- Netscape 7+
- Opera 3+
- Safari
Není-li ve výše uvedeném seznamu zobrazeno žádné číslo verze, je to proto, že jej všechny verze prohlížeče podporují.
Jedna věc, na kterou je třeba si uvědomit, je, že zatímco všechny prohlížeče podporují prvek IFRAME, některé funkce HTML5 jsou stále omezené.
- Použití přetečení k vypnutí rolování není spolehlivé. Pokud nechcete, aby se vaše rámce iframe nacházely na posuvníku, měli byste pokračovat v použití atributu rolování.
- Atributy srcdoc, sandbox a hladké atributy momentálně nepodporují žádné prohlížeče.
Propojení s rámci Iframes
Když zadáte vaše prvky iframe jméno nebo id, můžete potom odkazovat na daný rámeček s atributem na prvek A. Poté, když uživatel klepne na odkaz, otevře se uvnitř referenčního rámce iframe než aktuálního okna.
Zkus to sám. Do webové stránky zadejte následující:
Pokud dokument otevřený v nástroji IFRAME nemá žádné cíle nastavené, budou všechny tyto odkazy otevřeny ve stejném rámci jako výchozí dokument.
Tuto funkci můžete použít k vytvoření odkazů v jednom IFRAME změně obsahu jiného IFRAME na stejné stránce.
IFrames a zabezpečení
Prvek IFRAME sám o sobě není bezpečnostním rizikem pro vás či vaše čtenáře.
Bohužel iframe mají špatnou pověst, protože mohou být použity škodlivými webovými stránkami k tomu, aby obsahovaly obsah, který může infikovat počítač návštěvníka, aniž by je viděli na stránce. To se provádí tím, že odkazy odkazují na neviditelný IFRAME a ty skripty vypnou škodlivý kód. Uživatel klikne na odkaz a domnívá se, že odkaz je přerušený, protože se zdálo, že se nic nestalo, ale skript byl vypnut, kde ho nemohli vidět.
Tam jsou také počítačové viry, které budou injekcí neviditelný IFRAME na vašich webových stránkách, účinně obrátí vaše webové stránky na botnet. Mohou to udělat pomocí SQL injection a dalších útoků.
Věc, kterou si zapamatujete při přidávání IFRAME na vaší webové stránce, je, že uživatelé jsou jen tak bezpečné jako obsah všech webů, na které odkazujete. Pokud máte důvod cítit, že web je nedůvěryhodný, nepřipojujte se k němu žádným způsobem a rozhodně nezapomeňte jeho obsah do IFRAME. Spojení se svými vlastními stránkami v rámci prvků iframe však nepředstavuje bezpečnostní riziko pro vás ani pro vaše uživatele.
Původní článek Jennifer Krynin. Upraveno dne 11/7/16 Jeremy Girard