Kako umetnuti iframe u HTML: primjer upotrebe

U zoru gradnje web-lokacije, web resursi intenzivno su upotrebljavali okviri za prikaz pojedinih dijelova stranica. No, s dolaskom nove inačice HTML 5, sve se promijenilo. Elementi označavanja <okvir>, <skupa okvira> i <NoFrames> smatraju se zastarjelim. Zamjena je bila jedna oznaka - <iframe>. Kako dodati html <iframe>? Primjer u nastavku će biti razumljiv čak i za početnike u programiranju.

Koje su okviri?

Okvir je osnova većine prvih web stranica. Ako prevodite doslovno, ova riječ znači "okvir", to jest okvir je mali dio stranice u pregledniku. Široko korištenje okvira u prošlosti može se objasniti niskom kvalitetom i visokim troškovima internetskog prometa. U pravilu, mjesto je podijeljeno na 3-5 dijelova, od kojih svaka ispunjava određenu svrhu:

• "Cap" (gornji okvir na širini stranice) - prikazati naziv resursa;
• lijevo / desno "staklo" - izlaz izbornika;
• središnji je okvir prikaz sadržaja web mjesta.

Odvajanje stranice u dijelove dopušteno je preopteretiti samo određeni dio prilikom ažuriranja. Na primjer, korisnik je kliknuo stavku izbornika, a novi je sadržaj preuzet u središnji okvir.

Moderni okviri u HTML-u 5

Zašto koristiti HTML <iframe>? Primjer je umetanje sadržaja iz resursa treće strane. Klasična je situacija kada web-programer želi prikazati položaj nekog objekta na karti. Kako biti? Nacrtati plan terena od nule? Ne - tu je jednostavnije rješenje: ugraditi element Google karte, Yandex karte ili 2GIS na stranicu. Problem se rješava u četiri akcije.

1. Morate ići na mjesto bilo koje kartografske usluge.
2. Pronađite željeni objekt. Znajući točnu adresu, možete ga unijeti u okvir za pretraživanje.
3. Koristite gumb za "Spremanje i primanje koda" (za "Yandex.Map") ili "Gotovo" (za Google karte) da biste unijeli kôd.
4. Ostaje unijeti generirane oznake oznake na stranici.

Osim toga, možete odabrati veličinu karte i konfigurirati druge mogućnosti prikaza.

Kako mogu drugo koristiti HTML <iframe>? Primjer je umetanje video materijala iz YouTube resursa. Multimedijska tehnologija privlači korisnike Interneta pa je video sadržaj toliko popularan. Uz instalaciju video developera će se nositi brzo.

1. Trebali biste prenijeti vlastiti videozapis na YouTube ili pronaći datoteku treće strane za emitiranje.
2. Preuzmite oznaku odabirom gumba "HTML"
3. Konačna radnja je umetnuti u HTML kôd <iframe>. U nastavku će se raspravljati o primjeru sadržaja oznake.

Oba primjera koriste se automatskigeneriranje koda, ali profesionalni razvojni programeri trebali bi ga sami sastaviti. Prvo, omogućit će im da razumiju izgled stranice i, ako je potrebno, mijenjati. Drugo, ne uvijek označavanje elemenata web lokacije (iako pripadaju vanjskom resursu) formira se bez sudjelovanja webmastera. Evo visoke kvalifikacije razvojnog programera.

sintaksa

Dakle, prije nego što počnete s izgledom stranice, trebate uzeti u obzir oznaku iframe (html): što je to i kako ga pravilno koristiti.

Prije svega treba napomenuti da je oznaka uparena. Između elemenata otvaranja i zatvaranja navedite sadržaj koji će se prikazati u preglednicima koji ne podržavaju ovaj element izgleda. Glavni atributi oznake:

• širina (širina);
• visina (visina);
• src (adresa učitanih resursa);
• poravnati (metoda poravnanja);
• frameborder;
• allowfullscreen.

Stoga se dobiva kôd za <iframe>. Primjer HTML-a u potpunosti je prikazan u nastavku:

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

U rezultiranom obilježavanju dovoljno je zamijeniti adresu web mjesta s bilo kojom drugom i po potrebi ispraviti veličine okvira.