Kostenlos Online Lesen
HTML5-Handbuch - die neuen Features von HTML5
Titel:
HTML5-Handbuch - die neuen Features von HTML5 Kostenlos Bücher Online Lesen
Autoren:
Franzis
Vom Netzwerk:
B.
<br /> Durch den Namen definieren Sie einen konkreten Browsing-Context für den Inline-Frame-Inhalt, also eine Art Fenster. Über den Namen des Objekts kann sein Inhalt in JavaScript angesprochen werden. Den Namen können Sie auch in Hyperlinks beim<br />target<br />-Attribut verwenden. So können Sie mit<br /> <a href="kunden-navigation.html" target="navigation">Navigation für Kunden</a><br /> einen Link anbieten, bei dessen Anklicken sich der Inhalt des<br />iframe<br />-Elements mit<br />name="navigation"<br />ändert.<br /> Bei<br />width<br />und<br />height<br />interpretieren die Browser seit jeher auch Prozentangaben. Diese werden durch Angaben wie<br />width="80%"<br />oder<br />height="100%"<br />notiert.<br />Im HTML5-Standard wird diese Möglichkeit jedoch nicht ausdrücklich erwähnt. Stattdessen wird dort ausdrücklich darauf hingewiesen, dass die Angaben bei<br />width<br />und<br />height<br />sogenannte CSS-Pixel bedeuten. Das bedeutet: ein Pixel bei einer für Bildschirme angenommenen Pixel-per-Inch-Dichte von 96 ppi, bzw. 72 ppi bei älteren Bildschirmen.<br /> Im Zusammenhang mit eingebetteten Frames kann es in einem Webseiten-Layout durchaus sinnvoll sein, prozentuale Breiten anzugeben. Allerdings ist das auch mit der CSS-Eigenschaft<br />width<br />möglich, und dort sind Prozentangaben explizit erlaubt.<br /> Per Voreinstellung zeigen Web-Browser eingebettete Frames mit einem sichtbaren Rahmen an. In vielen Fällen soll ein solcher Rahmen unterdrückt werden, weil er im Layout stört. Im obigen Beispiel wurde der Rahmen deshalb mit<br />style="border: 0; "<br />unterdrückt.<br />Die früher üblichen HTML-Attribute<br />border<br />oder gar<br />frameborder<br />gehören seit HTML5 dagegen nicht mehr zum Standard.<br /> Das Gleiche gilt auch für die Beeinflussung des Scroll-Verhaltens im Inline-Frame-Inhalt. Das früher übliche Attribut<br />scrolling<br />entfällt in HTML5 ersatzlos. Stattdessen können Sie das Scroll-Verhalten wie das anderer HTML-Elemente auch mit der CSS-Eigenschaft<br />overflow<br />beeinflussen.<br /> In der eingebetteten Datei mit der Navigation, ist es notwendig, den Tag<br /><base target= "_parent"><br />zu notieren. Sonst würden die Hyperlinks innerhalb des<br />iFrame<br />-Elements angezeigt werden.<br />Eingebettete Frames und Sandboxing (HTML5)<br /> Im Web 2.0 ist es nicht unüblich, über eingebettete Frames Inhalte eigens dafür vorgesehener Webservices von Drittanbietern einzubinden. Dabei gilt jedoch in allen modernen Browsern die sogenannte Same-Origin-Policy. Diese hindert in Webseiten eingebundene Inhalte von fremden Websites daran, die einbindende Webseite während der Anzeige im Browser zu manipulieren. Für manche eingebundenen Services, die der Webseiten-Autor in einem<br />iframe<br />einbindet, kann es aber nützlich sein, die Same-Origin-Policy zu lockern.<br />HTML5 hat deshalb eine Möglichkeit eingeführt, Browsern mitzuteilen, welche Berechtigungen einem Inline-Frame-Inhalt von einer fremden Website eingeräumt werden sollen. Dazu dient das<br />sandbox<br />-Attribut.<br /> Diesem Attribut können Sie einen oder mehrere der folgenden Werte zuweisen:<br />• <br />allow-same-origin<br />: Mit diesem Wert erlauben Sie, dass die per Inline-Frame eingebettete Webseite vom Browser so behandelt werden soll, als würde sie vom gleichen Host oder der gleichen Domain stammen wie das einbindende HTML-Dokument. Durch die Angabe dieses Attributwerts heben Sie die Same-Origin-Policy für das<br />iframe<br />-Element auf.<br />• <br />allow-top-navigation<br />: Mit diesem Wert erlauben Sie dem eingebundenen Inhalt, den Inhalt des obersten Browsing-Contexts zu ändern. D. h. wenn die eingebettete Webseite beispielsweise Hyperlinks mit einer Angabe wie<br /><a href="eigener-inhalt.html" target="_top"><br />enthält, wird beim Anklicken das gesamte aktuelle Browserfenster bzw. der aktuelle Browser-Tab geändert (und nicht nur der Inhalt des Inline-Frames).<br />• <br />allow-forms<br />: Mit dieser Angabe erlauben Sie, dass die eingebettete Webseite Formulare enthalten darf, also vom Anwender Eingaben abfragen oder erzwingen kann. Der Anwender weiß aber möglicherweise gar nicht, dass diese Formulare von einem ganz anderen Web-Anbieter stammen als von dem, dessen Webseite er gerade aufgerufen hat und die das Formular in einem eingebetteten Frame enthält.<br />• <br />allow-scripts<br />: Mit dieser Angabe erlauben Sie, dass die eingebettete Webseite JavaScript-Code enthalten darf, der auf die einbettende Webseite zugreift, also aus dem Inline-Frame-Fenster heraus zum Beispiel Inhalte einer im Browser angezeigten, einbettenden Webseite manipulieren kann.<br /> Möglich sind also Einzelangaben wie<br /><iframe </div> <div> <ul class="pgn" role="navigation"> <li> <a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/97" rel="prev" aria-label="« Vorherige">«</a> </li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5">1</a></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/2">2</a></li> <li class="dis" aria-disabled="true"><span>...</span></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/95">95</a></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/96">96</a></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/97">97</a></li> <li class="act" aria-current="page"><span>98</span></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/99">99</a></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/100">100</a></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/101">101</a></li> <li class="dis" aria-disabled="true"><span>...</span></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/297">297</a></li> <li><a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/298">298</a></li> <li> <a href="/kostenlose-html5-handbuch-die-neuen-features-von-html5/lesen/99" rel="next" aria-label="Nächster »">»</a> </li> </ul> </div> <div class="otr"> <h2>Weitere Kostenlose Bücher</h2> <div class="itm itma"> <a href="/kostenlose-dryadenzauber-die-saga-vom-waldvolk-german-edition" title="Dryadenzauber (Die Saga vom Waldvolk) (German Edition)"> <img class="lz" data-src="/covers/04/43/74/cover.jpg" alt="Dryadenzauber (Die Saga vom Waldvolk) (German Edition)" /> </a> <div class="itm-info"> <a href="/kostenlose-dryadenzauber-die-saga-vom-waldvolk-german-edition" title="Dryadenzauber (Die Saga vom Waldvolk) (German Edition)"> Dryadenzauber (Die Saga vom Waldvolk) (German Edition) Online Lesen </a> von <a href="/autor-niespor-doris-online-lesen-downloaden-kostenlos" title="Doris Niespor">Doris Niespor</a> <div class="rkl-b"> <a href="/kostenlose-dryadenzauber-die-saga-vom-waldvolk-german-edition" title="Dryadenzauber (Die Saga vom Waldvolk) (German Edition)"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> <div class="itm itma"> <a href="/kostenlose-0240-an-der-schwelle-der-hoelle" title="0240 - An der Schwelle der Hölle"> <img class="lz" data-src="/i/de/debookcover.png" alt="0240 - An der Schwelle der Hölle" /> </a> <div class="itm-info"> <a href="/kostenlose-0240-an-der-schwelle-der-hoelle" title="0240 - An der Schwelle der Hölle"> 0240 - An der Schwelle der Hölle Online Lesen </a> von <a href="/autor-unbekannt-online-lesen-downloaden-kostenlos" title="Unbekannt">Unbekannt</a> <div class="rkl-b"> <a href="/kostenlose-0240-an-der-schwelle-der-hoelle" title="0240 - An der Schwelle der Hölle"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> <div class="itm itma"> <a href="/kostenlose-flaming-bess-01-das-erbe-der-erde" title="Flaming Bess 01 - Das Erbe der Erde"> <img class="lz" data-src="/covers/28/44/cover.jpg" alt="Flaming Bess 01 - Das Erbe der Erde" /> </a> <div class="itm-info"> <a href="/kostenlose-flaming-bess-01-das-erbe-der-erde" title="Flaming Bess 01 - Das Erbe der Erde"> Flaming Bess 01 - Das Erbe der Erde Online Lesen </a> von <a href="/autor-ziegler-thomas-online-lesen-downloaden-kostenlos" title="Thomas Ziegler">Thomas Ziegler</a> <div class="rkl-b"> <a href="/kostenlose-flaming-bess-01-das-erbe-der-erde" title="Flaming Bess 01 - Das Erbe der Erde"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> <div class="itm itma"> <a href="/kostenlose-077-das-kollektiv" title="077 - Das Kollektiv"> <img class="lz" data-src="/covers/03/22/51/cover.jpg" alt="077 - Das Kollektiv" /> </a> <div class="itm-info"> <a href="/kostenlose-077-das-kollektiv" title="077 - Das Kollektiv"> 077 - Das Kollektiv Online Lesen </a> von <a href="/autor-stephanie-seidel-online-lesen-downloaden-kostenlos" title="Stephanie Seidel">Stephanie Seidel</a> <div class="rkl-b"> <a href="/kostenlose-077-das-kollektiv" title="077 - Das Kollektiv"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> <div class="itm itma"> <a href="/kostenlose-love-numbers-band-3" title="Love Numbers Band 3"> <img class="lz" data-src="/covers/02/53/91/cover.jpg" alt="Love Numbers Band 3" /> </a> <div class="itm-info"> <a href="/kostenlose-love-numbers-band-3" title="Love Numbers Band 3"> Love Numbers Band 3 Online Lesen </a> von <a href="/autor-fabienne-lee-online-lesen-downloaden-kostenlos" title="Fabienne Lee">Fabienne Lee</a> <div class="rkl-b"> <a href="/kostenlose-love-numbers-band-3" title="Love Numbers Band 3"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> <div class="itm itma"> <a href="/kostenlose-silberband-072-kontakte-mit-der-ewigkeit" title="Silberband 072 - Kontakte mit der Ewigkeit"> <img class="lz" data-src="/i/de/debookcover.png" alt="Silberband 072 - Kontakte mit der Ewigkeit" /> </a> <div class="itm-info"> <a href="/kostenlose-silberband-072-kontakte-mit-der-ewigkeit" title="Silberband 072 - Kontakte mit der Ewigkeit"> Silberband 072 - Kontakte mit der Ewigkeit Online Lesen </a> von <a href="/autor-perry-rhodan-online-lesen-downloaden-kostenlos" title="Perry Rhodan">Perry Rhodan</a> <div class="rkl-b"> <a href="/kostenlose-silberband-072-kontakte-mit-der-ewigkeit" title="Silberband 072 - Kontakte mit der Ewigkeit"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> <div class="itm itma"> <a href="/kostenlose-perry-rhodan-neo-019-unter-zwei-monden" title="Perry Rhodan Neo 019 - Unter zwei Monden"> <img class="lz" data-src="/covers/01/61/50/cover.jpg" alt="Perry Rhodan Neo 019 - Unter zwei Monden" /> </a> <div class="itm-info"> <a href="/kostenlose-perry-rhodan-neo-019-unter-zwei-monden" title="Perry Rhodan Neo 019 - Unter zwei Monden"> Perry Rhodan Neo 019 - Unter zwei Monden Online Lesen </a> von <a href="/autor-herren-marc-a-online-lesen-downloaden-kostenlos" title="Marc A. Herren">Marc A. Herren</a> <div class="rkl-b"> <a href="/kostenlose-perry-rhodan-neo-019-unter-zwei-monden" title="Perry Rhodan Neo 019 - Unter zwei Monden"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> <div class="itm itma"> <a href="/kostenlose-die-virus-waffe" title="Die Virus-Waffe"> <img class="lz" data-src="/covers/02/31/31/cover.jpg" alt="Die Virus-Waffe" /> </a> <div class="itm-info"> <a href="/kostenlose-die-virus-waffe" title="Die Virus-Waffe"> Die Virus-Waffe Online Lesen </a> von <a href="/autor-james-barrington-online-lesen-downloaden-kostenlos" title="James Barrington">James Barrington</a> <div class="rkl-b"> <a href="/kostenlose-die-virus-waffe" title="Die Virus-Waffe"> <img src="/i/de/rlesen.png" /> </a> </div> </div> </div> </div> </div> <footer> <div class="inn"> <div class="lf"> © Kostenlos Online Lesen 2024 support@kostenlosonlinelesen.net </div> <div class="rg"> <!-- Begin Web-Stat code v 6.3 --> <span id="wts1866490"> </span><script> var wts=document.createElement('script');wts.type='text/javascript'; wts.async=true;wts.src='https://wts.one/3/1866490/log6_2.js'; document.getElementById('wts1866490').appendChild(wts); </script><noscript><a href="https://www.web-stat.com"> <img src="https://wts.one/6/3/1866490.gif" alt="Web-Stat traffic analytics"></a></noscript> <!-- End Web-Stat code v 6.3 --> <!-- Yandex.Metrika counter --> <script type="text/javascript" > (function(m,e,t,r,i,k,a){m[i]=m[i]||function(){(m[i].a=m[i].a||[]).push(arguments)}; m[i].l=1*new Date();k=e.createElement(t),a=e.getElementsByTagName(t)[0],k.async=1,k.src=r,a.parentNode.insertBefore(k,a)}) (window, document, "script", "https://mc.yandex.ru/metrika/tag.js", "ym"); ym(53412301, "init", { clickmap:true, trackLinks:true, accurateTrackBounce:true, webvisor:true }); </script> <noscript><div><img src="https://mc.yandex.ru/watch/53412301" style="position:absolute; left:-9999px;" alt="" /></div></noscript> <!-- /Yandex.Metrika counter --> </div> </div> </footer> <script src="/js/de/detail.js?1570711139"></script> </body> </html>
Kostenlos Online Lesen 