U zoru web stranice zgrada resursi su naširoko koristi okvire za prikaz pojedinih dijelova stranice. No, s dolaskom nove verzije HTML 5, sve se promijenilo. Elementi označavanje , i <![CDATA[</em> zastarjelo. Zamjena im je postao jedan tag - <em><iframe>.</em> Kako dodati html <iframe>? Primjer u nastavku će biti jasno, čak i novak u programiranju. </p>
<h2> Što su okviri? </h2><p> Frame - temelj većina od prvih web stranica. Ako preveo doslovno, riječ znači „okvir”, to jest, okvir je mali dio stranice u pregledniku. Raširena upotreba okvira u prošlosti može se objasniti loše kvalitete i visoke cijene internet prometa. Tipično, stranica je bila podijeljena na 3-5 dijela, od kojih svaki obavlja specifičnu namjenu: </p>
<ul><li> „Cap” (gornji okvir širine stranice) - Prikaz naziv resursa; </li><li> Lijevo / Desno „staklo” - izbornik Prikaz, </li><li> Središnja okvir - koji prikazuje sadržaj web-mjesta. </li></ul><p><amp-img src="https://i23.delachieve.com/image/1dba462a7e230ecd.jpg" alt="HTML iframe primjer" width="580" height="435" layout="intrinsic"></amp-img></p>
<p> Raščlamba stranice kako bi se omogućilo pretovara samo dio njega prilikom nadogradnje. Na primjer, korisnik klikne na stavku izbornika, a središnji okvir su pumpa nove sadržaje. </p>
<h2> Moderni okviri u HTML 5 </h2><p> Zašto moram HTML <em><iframe>?</em> Primjer - za umetanje sadržaja treče strane. Klasična situacija kada web programer želi pokazati položaj objekta na karti. Što učiniti? Nacrtajte tlocrt od nule? Ne - ne postoji jednostavniji rješenje: izgraditi stranicu Google Map elementa Yandex Maps ili 2GIS. Problem je riješen u četiri koraka. </p>
<ol><li> Morate ići na stranice bilo koje usluge karti. </li><li> Pronađite željeni objekt. Znajući točnu adresu, možete ga unijeti u okvir za pretraživanje. </li><li> Koristite „Spremi i dohvati kôd” (za „Yandex.Maps”) ili „Finish” (Google Maps) da bi dobili kod za umetanje. </li><li> Ostaje pisati generirana markup oznake na stranici. </li></ol><p> Osim toga, možete odabrati veličinu karte i postaviti druge opcije prikaza. </p>
<p><amp-img src="https://i23.delachieve.com/image/20da6f9a7e280ece.jpg" alt="HTML iframe primjer" width="600" height="488" layout="intrinsic"></amp-img></p>
<p> Kako još možete koristiti HTML <em><iframe>?</em> Primjer - za umetanje videa s YouTubea resursa. Multimedijske tehnologije privući korisnike Interneta, pa je video sadržaja je tako popularan. Uz instalaciju developer valjka brzo riješiti. </p>
<ol><li> To bi trebao biti učitana na YouTube vlastiti video ili naći treće strane datoteku za prijevod. </li><li> Dobiti oznaku odabirom gumba «HTML-koda” </li><li> Završni akt - umetanje <a href="https://hr.delachieve.com/html-kod-html-kodovi-boja/">HTML kôd</a> <iframe>. Primjer primila sadržaj oznaka će biti objašnjeno u nastavku. </li></ol><p> U oba primjera mogu koristiti za automatsko generiranje koda, ali profesionalni programeri bi trebali biti u mogućnosti napraviti svoje. Prvo, to će im omogućiti da razumiju stranicu vorstke i mijenjati po potrebi. Drugo, mjesto nije uvijek obilježavanje elemenata (čak i unatoč činjenici da pripadaju vanjski izvor), nastaje bez sudjelovanja webmastera. Ovdje se također pojavljuje visoko kvalificirani programer. </p>
<p><amp-img src="https://i23.delachieve.com/image/92fab38a7e2d0ecf.jpg" alt="iFrame HTML to" width="680" height="450" layout="intrinsic"></amp-img></p>
<h2> sintaksa </h2><p> Dakle, prije nego što počnete stranicu vorstke, iframe (html) oznaka mora uzeti u obzir: što je to i kako ga koristiti. </p>
<p> Prije svega, treba napomenuti da je oznaka paru. Između otvaranja i zatvaranja članica ukazuju na sadržaj koji će biti prikazan u preglednicima koji ne podržavaju markup element. Osnovna oznaka atributa: </p>
<ul><li> Širina (W); </li><li> visina (visina); </li><li> src (adresa napunjen resursa); </li><li> poravnati (postupak poravnanja); </li><li> frameborder; </li><li> allowfullscreen. </li></ul><p> Dakle, da biste dobili broj za <iframe>. HTML-primjer potpunosti pokazati u daljnjem tekstu: </p>
<p> <em><Width iframe = "560" height = "315" src = "https://someserver.com/" frameborder =</em> " <em>0" allowfullscreen> </ iframe></em> </p>
<p> Izgled tablice je dovoljno zamijeniti adresu stranice na bilo koji drugi i, ako je potrebno, prilagoditi veličinu okvira. </p>
</div>
<!--mvp-content-main-->
</div>
<!--mvp-content-body-top-->
</div>
<!--mvp-content-body-->
</div>
<!--mvp-content-wrap-->
</div>
<!--mvp-post-content-->
</div>
<!--mvp-post-main-->
<div id="mvp-post-more-wrap" class="left relative">
<h4 class="mvp-post-header">
<span class="mvp-post-header">Similar articles</span>
</h4>
<ul class="mvp-post-more-list left relative">
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/kako-uciti-graficki-dizajn-i-postati-visoko-placeni-strucnjak/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/747b8c3261950e60-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/747b8c3261950e60-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/kako-uciti-graficki-dizajn-i-postati-visoko-placeni-strucnjak/">
<p>Kako učiti grafički dizajn i postati visoko plaćeni stručnjak</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Internet</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/css-okviri-za-responzivni-dizajn/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/236ed6537e2d0ece-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/236ed6537e2d0ece-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/css-okviri-za-responzivni-dizajn/">
<p>CSS-okviri za responzivni dizajn</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Internet</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/bootstrap-sto-je-to-twitter-bootstrap-dizajn-i-izrada-web-stranica/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/b3f5a875705f0ea3-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/b3f5a875705f0ea3-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/bootstrap-sto-je-to-twitter-bootstrap-dizajn-i-izrada-web-stranica/">
<p>Bootstrap - Što je to? Twitter Bootstrap - dizajn i izrada web stranica</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Internet</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/web-studio-ocjena-usluge-za-izradu-i-promociju-web-stranice-misljenja/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/04b4d8947dc50ec8-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/04b4d8947dc50ec8-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/web-studio-ocjena-usluge-za-izradu-i-promociju-web-stranice-misljenja/">
<p>Web Studio: Ocjena usluge za izradu i promociju web stranice, mišljenja</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Internet</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/sto-je-banner-unutarnji-pregled-i-povijest-njezina-nastanka/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/2a8c751262480e6e-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/2a8c751262480e6e-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/sto-je-banner-unutarnji-pregled-i-povijest-njezina-nastanka/">
<p>Što je banner - unutarnji pregled i povijest njezina nastanka</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Internet</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/svojstva-css-boja-kodovi-boja/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/690bcf177ecb0edf-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/690bcf177ecb0edf-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/svojstva-css-boja-kodovi-boja/">
<p>Svojstva CSS boja. kodovi boja</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Internet</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
</ul>
</div>
<!--mvp-post-more-wrap-->
<p> </p><p> </p><p> </p><p> </p>
<div id="mvp-post-more-wrap" class="left relative">
<h4 class="mvp-post-header">
<span class="mvp-post-header">Trending Now</span>
</h4>
<ul class="mvp-post-more-list left relative">
<li>
<div class="mvp-post-more-img left relative">
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/krumpir-u-dvostrukom-kotlu-u-aerogrilu-iu-rukavici-recepti/">
<p>Krumpir u dvostrukom kotlu, u aerogrilu iu rukavici. Recepti.</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Hrana i piće</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/ukratko-o-vazno-hexicon-drozd-i-druge-bolesti/">
<p>Ukratko o važno: „Hexicon” drozd i druge bolesti</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Zdravlje</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/vitamin-f-njegova-uloga-i-znacaj-koje-namirnice-sadrze-vitamin-f/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/7bd739cf6ff60ea0-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/7bd739cf6ff60ea0-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/vitamin-f-njegova-uloga-i-znacaj-koje-namirnice-sadrze-vitamin-f/">
<p>Vitamin F, njegova uloga i značaj. Koje namirnice sadrže vitamin F</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Zdravlje</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/sto-je-ispunjen-s-homeopatijom-koji-razmatra-pohvale/">
<p>Što je ispunjen s homeopatijom, koji razmatra pohvale?</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Zdravlje</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/politika-u-svijetu-dogadjaji-i-licnosti/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/4be078367e9f0edb-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/4be078367e9f0edb-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/politika-u-svijetu-dogadjaji-i-licnosti/">
<p>Politika u svijetu: događaji i ličnosti</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Novosti i društvo</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/korak-platforma-sa-svojim-vlastitim-rukama-kako-napraviti-platformu-za-korak-aerobic/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/2a9c08ee7de70ecb-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/2a9c08ee7de70ecb-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/korak-platforma-sa-svojim-vlastitim-rukama-kako-napraviti-platformu-za-korak-aerobic/">
<p>Korak platforma sa svojim vlastitim rukama. Kako napraviti platformu za korak aerobic</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Jednostavnost</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
</ul>
</div>
<!--mvp-post-more-wrap-->
<p> </p><p> </p><p> </p><p> </p>
<div id="mvp-post-more-wrap" class="left relative">
<h4 class="mvp-post-header" style="margin-top:40px;">
<span class="mvp-post-header">Newest</span>
</h4>
<ul class="mvp-post-more-list left relative">
<li>
<div class="mvp-post-more-img left relative">
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/sigurna-kupnja-nekretnina-u-abhaziji/">
<p>Sigurna kupnja nekretnina u Abhaziji</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Jednostavnost</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/lijevo-opis-radnje-glumaca-i-uloga-povratne-informacije-o-zlokobni-filma/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/ed7857ae705f0ea7-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/ed7857ae705f0ea7-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/lijevo-opis-radnje-glumaca-i-uloga-povratne-informacije-o-zlokobni-filma/">
<p>„Lijevo”: opis radnje, glumaca i uloga. Povratne informacije o „zlokobni” filma</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Umjetnost i zabava</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/kako-podnijeti-zahtjev-za-razvod-pojedinosti-i-nijanse/">
<p>Kako podnijeti zahtjev za razvod - pojedinosti i nijanse</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Odnosi</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/anjelica-huston-put-retardiranom-cudo-od-djeteta-na-neusporediv-femme-fatale/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/6f120fb97e120ece-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/6f120fb97e120ece-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/anjelica-huston-put-retardiranom-cudo-od-djeteta-na-neusporediv-femme-fatale/">
<p>Anjelica Huston: Put „retardiranom čudo od djeteta” na neusporediv femme fatale</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Umjetnost i zabava</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/sto-ako-macke-trebaju-masku/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/d0dc363e6f630e89-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/d0dc363e6f630e89-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/sto-ako-macke-trebaju-masku/">
<p>Što ako mačke trebaju masku?</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Hobi</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
<li>
<div class="mvp-post-more-img left relative">
<a href="https://hr.delachieve.com/zasto-vitaminske-tablete-su-beskorisni-pa-cak-i-stetni/">
<amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/2f022186a9c10f02-560x315.jpg" width="560" height="315" layout="responsive"></amp-img>
<amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/2f022186a9c10f02-80x80.jpg" width="80" height="80" layout="responsive"></amp-img>
</a>
</div>
<!--mvp-post-more-img-->
<div class="mvp-post-more-text left relative">
<a href="https://hr.delachieve.com/zasto-vitaminske-tablete-su-beskorisni-pa-cak-i-stetni/">
<p>Zašto vitaminske tablete su beskorisni, pa čak i štetni</p>
<h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Zdravlje</span></h3>
</a>
</div>
<!--mvp-post-more-text-->
</li>
</ul>
</div>
<!--mvp-post-more-wrap-->
</div>
<!--mvp-main-box-->
</div>
<!--mvp-article-cont-->
</article>
<!--mvp-article-wrap-->
</div>
<!--mvp-main-body-wrap-->
<footer id="mvp-foot-wrap" class="left relative">
<div id="mvp-foot-bot" class="left relative">
<div class="mvp-main-box">
<div id="mvp-foot-copy" class="left relative">
<p>Copyright © 2018 hr.delachieve.com. Theme powered by WordPress.</p>
</div>
<!--mvp-foot-copy-->
</div>
<!--mvp-main-box-->
</div>
<!--mvp-foot-bot-->
</footer>
</div>
<!--mvp-site-main-->
</div>
<!--mvp-site-wall-->
</div>
<!--mvp-site-->
<div id="statcounter">
<amp-pixel src="https://c.statcounter.com/11999667/0/cc03a949/1/">
</amp-pixel>
</div>
</body>
</html>
<!-- Dynamic page generated in 1.174 seconds. -->
<!-- Cached page generated by WP-Super-Cache on 2019-09-30 18:51:45 -->
<!-- 0.002 --> ]]>