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.

1. El kell menned a térképészeti szolgáltatások webhelyére.
2. Keresse meg a kívánt objektumot. A pontos címet tudva megadhatja a keresőmezőbe.
3. 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.
4. 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.

1. 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.
2. Szerezd meg a címkét a "HTML" gombra kattintva
3. 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 az elrendezés elkezdése előtt figyelembe kell venni az iframe (html) címkét: mi az, és hogyan kell helyesen 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:

• szélesség (szélesség);
• magasság (magasság);
• src (a betöltött erőforrás címe);
• igazítás (igazítási módszer);
• frameborder;
• allowfullscreen.

Így az <iframe> kódot kapjuk. A HTML példát teljes mértékben bemutatjuk:

<iframe width = "560" height = "315" src = "https://someserver.com/" frameborder = "0" allowfullscreen> </ iframe>

Az eredményes jelölésnél elegendő egy hely címének helyettesítése másikkal, és ha szükséges, egy keret méretének kijavítására.