InternetWeb Design

Kuidas sisestada HTML iframe: näiteks kasutada

Koidikul veebisaiti hoone ressursse kasutatakse laialdaselt raamid näidata teatud leheosasid. Aga saabumist uue versiooni HTML 5, kõik muutus. Elemendid märgistuskeel ja </em> aegunud. Asendades need on muutunud ühe tag - <em><iframe>.</em> Kuidas lisada html <iframe>? Allpool toodud näites on arusaadav, isegi algaja programmeerimine. </p> <h2> Mis on raamid? </h2><p> Frame - alusel kõige esimese veebilehti. Kui on tõlgitud sõna otseses mõttes sõna tähendab &quot;raam&quot;, mis tähendab, et raam on väike osa otse brauseris. Laialdast kasutamist raamid varem saab seletada halva kvaliteediga ja kõrge maksumus Internet liiklust. Tüüpiliselt saidi jagati 3-5 osaks, millest igaüks täidab konkreetsel eesmärgil: </p> <ul><li> &quot;Cap&quot; (top raami lehe laius) - Display nimi ressurss; </li><li> Vasakule / paremale &quot;klaas&quot; - kuvamenüüd; </li><li> Kesk raami - näitab saidi sisu. </li></ul><p><amp-img src="https://i23.delachieve.com/image/1dba462a7e230ecd.jpg" alt="html iframe&#39;i näiteks" width="580" height="435" layout="intrinsic"></amp-img></p> <p> Jaotus lehti, mis võimaldab ümberlaadimise ainult osa sellest, kui sa uuendada. Näiteks kasutaja klõpsab menüüvaliku ja Kesk raami pumbati uue sisu. </p> <h2> Modern raamid HTML 5 </h2><p> Miks ma pean HTML <em><iframe>?</em> Näide - lisada kolmanda osapoole saidi sisu. Klassikaline olukord on siis, kui veebi arendaja tahab näidata objekti positsiooni kaardil. Mida teha? Joonista põhiplaaniga nullist? Ei - on lihtsam lahendus: ehitada leht Google Map element Yandex Maps või 2GIS. Probleem on lahendatud neljas etapis. </p> <ol><li> Sa pead minema saidile tahes kaardi teenust. </li><li> Leidke soovitud objekt. Teades täpne aadress, saate selle sisestada otsinguväljale. </li><li> Kasuta &quot;Salvesta ja saada koodi&quot; (eest &quot;Yandex.Maps&quot;) või &quot;Finish&quot; (Google Maps), et saada koodi sisestada. </li><li> Jääb kirjutada loodud juurdehindlus silte lehel. </li></ol><p> Lisaks saate valida suuruse kaart ja määrata muu kuva võimalusi. </p> <p><amp-img src="https://i23.delachieve.com/image/20da6f9a7e280ece.jpg" alt="html iframe&#39;i näiteks" width="600" height="488" layout="intrinsic"></amp-img></p> <p> Kuidas muidu saab kasutada HTML <em><iframe>?</em> Näide - lisada videoid Youtube ressurss. Multimeedia Technologies internetikasutajate ligimeelitamiseks, nii video sisu on nii populaarne. Paigaldamisega arendaja rull hakkama kiiresti. </p> <ol><li> Tuleb üles laadida Youtube enda video või leida kolmanda osapoole faili tõlkida. </li><li> Saa tag valides nuppu «HTML-koodi&quot; </li><li> Lõppakt - sisestada <a href="https://et.delachieve.com/html-koodi-html-vaervikoodidega/">HTML kood</a> <iframe>. Näide said välja sisu arutatakse allpool. </li></ol><p> Mõlema näite ma kasutan automaatset kood põlvkonna, kuid professionaalne arendajad peaks olema võimalik teha oma. Esiteks, see võimaldab neil mõista vorstke lehele ja seda vajadusel muutma. Teiseks ei ole saidil alati märgistamise elemente (isegi vaatamata sellele, et nad kuuluvad välise ressursi), on moodustatud ilma osalemine webmaster. Siin kuvatakse ka kõrgelt kvalifitseeritud arendaja. </p> <p><amp-img src="https://i23.delachieve.com/image/92fab38a7e2d0ecf.jpg" alt="iframe html see" width="680" height="450" layout="intrinsic"></amp-img></p> <h2> süntaks </h2><p> Nii et enne kui hakkate lehekülg vorstke, iframe (html) tag peab silmas pidama: mis see on ja kuidas seda kasutada. </p> <p> Kõigepealt tuleb märkida, et tag paari. Vahel avamise ja sulgemise liige näitavad sisu kuvada brauserid, mis ei toeta juurdehindlus element. Basic tag atribuudid: </p> <ul><li> laius (W); </li><li> kõrgus (kõrgus); </li><li> src (aadress koormatud ressurssi); </li><li> joondada (ühtlustumine); </li><li> frameborder; </li><li> allowfullscreen. </li></ul><p> Seega, et saada kood <iframe>. HTML-näiteks täielikult allpool näidatud: </p> <p> <em><Iframe&#39;i width = &quot;560&quot; height = &quot;315&quot; src = &quot;https://someserver.com/&quot; frameborder =</em> &quot; <em>0&quot; allowfullscreen> </ iframe></em> </p> <p> Tabelis paigutus on piisav, et asendada saidi aadress muid ja vajadusel reguleerige raami suurust. </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://et.delachieve.com/suurus-favikon-saidile/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/f9f0b8527e6f0ed5-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/f9f0b8527e6f0ed5-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://et.delachieve.com/suurus-favikon-saidile/"> <p>Suurus Favikon saidile</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://et.delachieve.com/jquery-aknasuesteemi-mida-sa-vajad-ja-kuidas-installida/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/b36fd1d6704f0ea3-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/b36fd1d6704f0ea3-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://et.delachieve.com/jquery-aknasuesteemi-mida-sa-vajad-ja-kuidas-installida/"> <p>JQuery aknasüsteemi - mida sa vajad ja kuidas installida</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://et.delachieve.com/leivapuru-veebilehel-mis-need-on-navigation-leivapuru/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/8d4ea085702c0ea2-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/8d4ea085702c0ea2-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://et.delachieve.com/leivapuru-veebilehel-mis-need-on-navigation-leivapuru/"> <p>&quot;Leivapuru&quot; veebilehel: mis need on? Navigation &quot;leivapuru&quot;</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://et.delachieve.com/css-raamistikud-kujundusega/"> <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://et.delachieve.com/css-raamistikud-kujundusega/"> <p>CSS-raamistikud kujundusega</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"> </div> <!--mvp-post-more-img--> <div class="mvp-post-more-text left relative"> <a href="https://et.delachieve.com/naepunaeiteid-algajatele-kuidas-valida-koige-sobivam-html-editor/"> <p>Näpunäiteid algajatele: kuidas valida kõige sobivam html editor</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://et.delachieve.com/oige-saidi-kujundus-edu-voti/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/e3a19d7553d50e2c-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/e3a19d7553d50e2c-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://et.delachieve.com/oige-saidi-kujundus-edu-voti/"> <p>Õige Saidi kujundus - edu võti</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>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</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://et.delachieve.com/noud-alates-kana-puguga/"> <p>Nõud alates kana puguga</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Toiduained ja joogid</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/potjomkini-taehed-suembol-odessa/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/7827926762560e75-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/7827926762560e75-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://et.delachieve.com/potjomkini-taehed-suembol-odessa/"> <p>Potjomkini tähed - sümbol Odessa</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Reisimine</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/mitu-live-lestad-ja-kus-nad-elavad/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/4be234b26fc60e9b-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/4be234b26fc60e9b-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://et.delachieve.com/mitu-live-lestad-ja-kus-nad-elavad/"> <p>Mitu live lestad ja kus nad elavad?</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Uudised ja ühiskond</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/usaldusvaeaerne-ja-odav-dziibid-uelevaade-vordlus-konkurentidega-ja-tagasisidet-tootjate/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/1538bb677f160ee4-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/1538bb677f160ee4-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://et.delachieve.com/usaldusvaeaerne-ja-odav-dziibid-uelevaade-vordlus-konkurentidega-ja-tagasisidet-tootjate/"> <p>Usaldusväärne ja odav džiibid: ülevaade, võrdlus konkurentidega ja tagasisidet tootjate</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Autod</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://et.delachieve.com/miks-ma-pean-tablett/"> <p>Miks ma pean tablett?</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Arvutid</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/kuidas-saada-gru-erivaeed-vene-spetsnaz-gru-gru/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/5018bf4870920ead-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/5018bf4870920ead-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://et.delachieve.com/kuidas-saada-gru-erivaeed-vene-spetsnaz-gru-gru/"> <p>Kuidas saada GRU (eriväed)? Vene Spetsnaz GRU. GRU</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Seadus</span></h3> </a> </div> <!--mvp-post-more-text--> </li> </ul> </div> <!--mvp-post-more-wrap--> <p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</p><p>&nbsp;</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"> <a href="https://et.delachieve.com/nagu-the-sims-3-abielluda-naepunaeiteid-ilus-pulm-tseremoonia/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/d185f4ae6fe60e9d-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/d185f4ae6fe60e9d-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://et.delachieve.com/nagu-the-sims-3-abielluda-naepunaeiteid-ilus-pulm-tseremoonia/"> <p>Nagu &quot;The Sims 3&quot; abielluda? Näpunäiteid ilus pulm tseremoonia</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Arvutid</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/paz-4234-ajalugu-kirjeldus-mudel/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/e36cbd786fdd0e9a-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/e36cbd786fdd0e9a-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://et.delachieve.com/paz-4234-ajalugu-kirjeldus-mudel/"> <p>PAZ 4234: ajalugu, kirjeldus mudel</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Autod</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/mood-mis-on-print/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/842687bf6f780e90-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/842687bf6f780e90-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://et.delachieve.com/mood-mis-on-print/"> <p>Mood. Mis on print?</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Reklaam</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/cleaner-tootmisueksused-ja-kontorid-ametijuhend/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/ce4bb13570770ea3-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/ce4bb13570770ea3-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://et.delachieve.com/cleaner-tootmisueksused-ja-kontorid-ametijuhend/"> <p>Cleaner tootmisüksused ja kontorid: ametijuhend</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Karjäär</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://et.delachieve.com/kuidas-teha-oma-sait-isiklik-kogemus/"> <p>Kuidas teha oma sait: isiklik kogemus</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Äri</span></h3> </a> </div> <!--mvp-post-more-text--> </li> <li> <div class="mvp-post-more-img left relative"> <a href="https://et.delachieve.com/nagu-feykovye-uudised-mojutavad-meie-igapaeevaelu/"> <amp-img class="mvp-reg-img" src="https://i23.delachieve.com/image/db14b015d3850f93-560x315.jpg" width="560" height="315" layout="responsive"></amp-img> <amp-img class="mvp-mob-img" src="https://i23.delachieve.com/image/db14b015d3850f93-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://et.delachieve.com/nagu-feykovye-uudised-mojutavad-meie-igapaeevaelu/"> <p>Nagu feykovye uudised mõjutavad meie igapäevaelu?</p> <h3 class="mvp-cat-bub"><span class="mvp-cat-bub">Ise kasvatamine</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 et.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.387 seconds. --> <!-- Cached page generated by WP-Super-Cache on 2019-09-30 15:30:55 --> <!-- 0.002 -->