Hogyan illeszthetünk be egy iframe-t HTML-be: egy példa a használatára

A webhelyépítés hajnalán a webes források széles körben használtak kereteket az egyes oldalak megjelenítésére. De a HTML 5 új verziójának megérkezésével minden megváltozott. Markup elemek <váz>, <frameset> és <noframes> elavultnak tekintik. Ezek cseréje egyetlen címke volt - <iframe>. Hogyan lehet hozzáadni a html <iframe> -hez? Az alábbi példa érthető lesz még a kezdők számára is.

Mi a keret?

A keret az első weboldalak többségének alapja. Ha szó szerint lefordít, ez a szó "keret" -et jelent, vagyis a keret egy kis része az oldalnak a böngészőben. A keretek széles körű használata a múltban az internetes forgalom alacsony színvonalával és magas költségeivel magyarázható. A helyszínt általában 3-5 részre osztották, amelyek mindegyike bizonyos célokat teljesített:

"Cap" (az oldal szélességének felső kerete) - megjeleníti az erőforrás nevét;
bal / jobb "üveg" - menü kimenet;
a központi keret a webhely tartalmának megjelenítése.

Az oldal feldarabolása csak olyan részekre bontja a részeket, amelyek a frissítés során csak egy bizonyos részét terhelhetik. Például a felhasználó rákattintott egy menüelemre, és az új tartalmat letöltötték a központi keretbe.

Modern keretek a HTML 5-ben

A HTML használata <iframe>? Példa erre a tartalom harmadik fél forrásból történő beillesztése. Egy klasszikus helyzet, amikor egy webfejlesztő meg akarja mutatni egy objektum helyzetét a térképen. Hogy legyenek? Rajzolj egy terep tervet a semmiből? Nem - egyszerűbb megoldás: beágyazni egy elemet a Google Térkép, a Yandex Maps vagy a 2GIS elemre az oldalon. A probléma négy lépésben megoldódik.

El kell menned a térképészeti szolgáltatások webhelyére.
Keresse meg a kívánt objektumot. A pontos címet tudva megadhatja a keresőmezőbe.
Használja a "Mentés és fogadási kód" gombot ("Yandex.Map") vagy a "Kész" (a Google térképekhez), hogy beillesztse a kódot.
Továbbra is meg kell adnia a létrehozott jelölési címkéket az oldalon.

Ezenkívül kiválaszthatja a térkép méretét és konfigurálhatja a többi megjelenítési lehetőséget.

Hogyan használhatok más módon a HTML <?iframe>? Például a videóanyag beillesztése a Youtube forrásból. A multimédiás technológia vonzza az internethasználókat, így a videotartalom annyira népszerű. A telepítő a videó fejlesztő gyorsan megbirkózik.

Fel kell töltened a saját videódadat a YouTube-on, vagy meg kell találnia egy harmadik féltől származó fájlt a műsorra.
Szerezd meg a címkét a "HTML" gombra kattintva
Az utolsó lépés a <iframe> HTML kód beillesztése. A címke tartalmának egy példáját az alábbiakban ismertetjük.

Mindkét példa automatikuskódot generálnak, de a szakmai fejlesztőknek képesnek kell lenniük arra, hogy maguk írják le. Először is lehetővé teszi számukra, hogy megértsék az oldal elrendezését, és ha szükséges, módosítsa azt. Másodszor, nem mindig a webhelyelemek jelölése (bár külső erőforráshoz tartoznak) a webmester részvétele nélkül alakul ki. Itt van a fejlesztő magas minősítése.

szintaxis

Tehát, mielőtt elkezdi oldal vorstke, iframe (html) kulcsszó kell mérlegelnie: mi ez, és hogyan kell használni.

Mindenekelőtt meg kell jegyezni, hogy a címke párosítva van. A nyitó és záró elemek között adja meg azokat a böngészőkben megjelenő tartalmat, amelyek nem támogatják ezt az elrendezési elemet. A címke fő jellemzői: