aboutsummaryrefslogtreecommitdiff
path: root/files/de/web/html/element/img/index.html
diff options
context:
space:
mode:
Diffstat (limited to 'files/de/web/html/element/img/index.html')
-rw-r--r--files/de/web/html/element/img/index.html348
1 files changed, 348 insertions, 0 deletions
diff --git a/files/de/web/html/element/img/index.html b/files/de/web/html/element/img/index.html
new file mode 100644
index 0000000000..01c64c5747
--- /dev/null
+++ b/files/de/web/html/element/img/index.html
@@ -0,0 +1,348 @@
+---
+title: <img>
+slug: Web/HTML/Element/img
+translation_of: Web/HTML/Element/img
+---
+<p>{{HTMLRef}}</p>
+
+<p>Das Element <strong>&lt;img&gt;</strong> fügt eine Grafik in ein Dokument ein.</p>
+
+<table class="properties">
+ <tbody>
+ <tr>
+ <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Inhaltskategorien</a></th>
+ <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Fließender Inhalt</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">gestaltender Inhalt</a>, eingebetteter Inhalt, fühlbarer Inhalt.<br>
+ Falls das Attribut {{htmlattrxref("usemap", "img")}} gesetzt ist, gehört das Element auch zu den interaktiven Inhalten.</td>
+ </tr>
+ <tr>
+ <th scope="row">Erlaubter Inhalt</th>
+ <td>Keiner, es ist ein {{Glossary("leeres Element")}}.</td>
+ </tr>
+ <tr>
+ <th scope="row">Tag-Verwendung</th>
+ <td>Muss einen Start-Tag, darf jedoch keinen End-Tag haben.</td>
+ </tr>
+ <tr>
+ <th scope="row">Erlaubte Elternelemente</th>
+ <td>Jedes Element, das gestaltenden Inhalt erlaubt.</td>
+ </tr>
+ <tr>
+ <th scope="row">DOM-Schnittstelle</th>
+ <td>{{domxref("HTMLImageElement")}}</td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Attributes">Attributes</h2>
+
+<p>Dieses Element unterstützt die <a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" title="HTML/Global attributes">globalen Attribute</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("align")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Ausrichtung der Grafik im Verhältnis zu ihrer Umgebung.<br>
+ Benutzen Sie stattdessen die CSS-Eigenschaft {{cssxref('vertical-align')}}.</dd>
+ <dt>{{htmlattrdef("alt")}}</dt>
+ <dd>Text, der vom Browser alternativ statt der Grafik angezeigt werden kann, zum Beispiel falls sie noch nicht heruntergeladen wurde, bei Übertragungsfehlern oder falls sie in keinem <a href="#Supported_image_formats" title="HTML/Element/Img#Supported image formats">unterstützten Format</a> vorliegt. Der Benutzer kann die Grafikdarstellung auch abgeschaltet haben oder einen Browser benutzen, der keine Grafik darstellen kann.</dd>
+ <dd>Der Text sollte das von der Grafik Dargestellte kurz und sinnvoll wiedergeben, so dass der Inhalt, den sie transportieren, ersichtlich wird. Ist dies nicht möglich, sollte das Attribut weggelassen werden.</dd>
+ <dd>Reine Dekorationselemente sollten hingegen mit einem leeren Attribut (<code>alt=""</code>) eingefügt werden; Alternativtexte wie "Roter Punkt" sind unbedingt zu vermeiden!</dd>
+ <dd>
+ <div class="note">
+ <p><strong>Hinweis:</strong> Eine aussagekräftige Beschreibung des Bildes ist vor allem für die Barrierefreiheit von elementarer Bedeutung!<br>
+ Dies gilt auch für das leere Attribut <code>alt=""</code>. Browser können die (Ersatz-) Darstellung des img-Elements in diesem Fall ganz überspringen, was merklich der Übersichtlichkeit dient – niemand möchte einen Text vorgelesen bekommen, ständig von nutzlosen Hinweisen wie "Roter Punkt" unterbrochen.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("border")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Breite des Rahmens um die Grafik. Benutzen Sie stattdessen die CSS-Eigenschaft {{cssxref('border')}}.</dd>
+ <dt>{{htmlattrdef("crossorigin")}} {{HTMLVersionInline(5)}}</dt>
+ <dd>Ist dieses Attribut gesetzt, wird die betreffende Grafik mittels <a href="/en-US/docs/CORS_Enabled_Image" title="CORS_Enabled_Image">CORS </a>(Cross-Origin Resource Sharing) abgerufen, wahlweise ohne den Benutzer zu authentifizieren oder mit:
+ <dl>
+ <dt><code>"anonymous"</code></dt>
+ <dd>Es wird eine CORS-basierte Anfrage durchgeführt, jedoch wird keine Benutzerauthentifizierung mitgesendet (Cookies, X.509-Zertifikat, HTTP-Authentifizierung).</dd>
+ <dt><code>"use-credentials"</code></dt>
+ <dd>Es wird eine CORS-basierte Anfrage durchgeführt, gegebenenfalls mit Benutzerauthentifizierung (Cookies, X.509-Zertifikat, HTTP-Authentifizierung).</dd>
+ </dl>
+ Hat das Attribut einen ungültigen Wert, wird stattdessen die Einstellung <strong>anonymous</strong> angenommen.<br>
+ Fehlt das crossorigin-Attribut, wird die Grafik ohne CORS heruntergeladen (d.h. ohne die HTTP-Kopfzeile {{HTTPHeader('Origin')}}).</dd>
+ <dd>Damit das Dokument uneingeschränkt auf die Grafik zugreifen kann (zum Beispiel im {{HTMLElement("canvas")}}-Element), muss der Server zusätzlich mit einer {{HTTPHeader('Access-Control-Allow-Credentials')}}-Angabe antworten, die den Ursprung des Dokuments einschließt.</dd>
+ <dd>Weitere Informationen sind im Artikel über <a href="/en-US/docs/HTML/CORS_settings_attributes" title="CORS settings attributes">CORS-Attribute</a> nachzulesen.</dd>
+ <dt>{{htmlattrdef("height")}}</dt>
+ <dd>Tatsächliche Höhe der Grafik in {{HTMLVersionInline(5)}} CSS-Pixeln, in {{HTMLVersionInline(4)}} Bildschirmpixeln oder als prozentualer Wert.</dd>
+ <dt>{{htmlattrdef("hspace")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Breite des Innenabstands links und rechts der Grafik. Benutzen Sie stattdessen die CSS-Eigenschaften {{cssxref('padding-left')}} und {{cssxref('padding-right')}} bzw. {{cssxref('padding')}}.</dd>
+ <dt>{{htmlattrdef("ismap")}}</dt>
+ <dd>Serverseitig verweissensitive Grafik. Ist dieses Attribut gesetzt, werden bei jedem Klick die betreffenden Mauskoordinaten an den Server gesendet.
+ <div class="note">
+ <p><strong>Hinweis: </strong>Dieses Attribut ist nur bei <code>&lt;img&gt;</code>-Elementen erlaubt, die sich innerhalb eines {{htmlelement("a")}}-Elements mit einem gültigen {{htmlattrxref("href","a")}}-Attribut befinden.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("longdesc")}}</dt>
+ <dd>URL einer längeren Beschreibung des Bildes, die als Ergänzung zum <strong>alt</strong>-Text dient.</dd>
+ <dt>{{htmlattrdef("name")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Name des Elements. Benutzen Sie stattdessen das <strong>id</strong>-Attribut.</dd>
+ <dt>{{htmlattrdef("referrerpolicy")}} {{experimental_inline}}</dt>
+ <dd>Definiert, was beim Abruf der Grafik als verweisende URL in der HTTP-Kopfzeile {{HTTPHeader('Referer')}} an den Server gesendet werden soll:
+ <ul>
+ <li><code>"no-referrer"</code>: Es wird nichts gesendet.</li>
+ <li>"<code>no-referrer-when-downgrade</code>": Wurde das die Grafik enthaltende Dokument über eine gesicherte Verbindung (HTTPS) abgerufen, wird nur dann <em>keine</em> verweisende URL gesendet, falls die Grafik über eine <em>ungesicherte</em> Verbindung abgerufen wird.<br>
+ Dies ist das Standardverhalten des Browsers, falls nichts anderes angegeben wurde.</li>
+ <li><code>"origin"</code>: Es wird der Ursprung des Dokuments gesendet, üblicherweise das Protokoll, die Domain und gegebenenfalls der Port (zum Beispiel <code>http://example.com:88</code>).</li>
+ <li>"<code>origin-when-cross-origin</code>": Wie <code>origin</code>, jedoch nur, falls die Grafik von einem anderen Server abgerufen wird. Ist der Server der gleiche, wird die vollständige URL des Dokuments, einschließlich Pfad, gesendet.</li>
+ <li><code>"unsafe-url"</code>: Es wird immer die vollständige verweisende URL gesendet (jedoch ohne Fragmentbezeichner, Benutzername und Passwort).<br>
+ Dies ist unsicher, da zuvor über gesicherte Verbindungen abgerufene Informationen (die URL des Dokuments) auch über nichtgesicherte gesendet werden könnten (als verweisende URL beim Abruf der Grafik).</li>
+ </ul>
+
+ <div class="note">
+ <p><strong>Hinweis:  </strong>In älteren Versionen hieß dieses Attribut <code>referrer</code>.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("sizes")}}{{HTMLVersionInline(5)}}</dt>
+ <dd>Mit dem <code>sizes</code>-Attribut wird die Anzeigegröße der Grafik in Abhängigkeit von der Größe des Anzeigegeräts festgelegt. Es enthält mehrere, durch Kommata getrennte Einträge, jeweils bestehend aus:
+ <ol>
+ <li>einer CSS-Medienbedingung, zum Beispiel <code>(max-width: 480px)</code>. Diese Angabe entfällt für den letzten Eintrag.</li>
+ <li>einer CSS-Größenangabe.</li>
+ </ol>
+
+ <p>Anhand dieser Einträge wählt der Browser eine der in <code>srcset</code> gebenenen Grafikquellen, sofern diese mit Breitenangaben ('<code>w</code>') versehen sind.<br>
+ Fehlt das <code>srcset</code>-Attribut oder enthält es keine Breitenangaben, wird <code>sizes</code> ignoriert.</p>
+ </dd>
+ <dt>{{htmlattrdef("src")}}</dt>
+ <dd>URL der Grafik. Dieses Attribut ist zwingend erforderlich.<br>
+ Browser, die <code>srcset</code> unterstützen, behandeln <code>src</code> als Grafik mit einer Pixeldichte von <code>1x</code>, sofern keine andere Grafik mit dieser Dichte in <code>srcset</code> aufgeführt ist oder falls <code>srcset</code> '<code>w</code>'-Bezeichner enthält.</dd>
+ <dt>{{htmlattrdef("srcset")}}{{HTMLVersionInline(5)}}</dt>
+ <dd><code>srcset</code> erlaubt das Bereitsstellen derselben Grafik in verschiedenen Versionen für niedrig- und hochauflösende Anzeigegeräte. Letztere profitieren von der höheren Bildqualität -bei größerer Datenmenge-, erstere von der geringeren Datenmenge.</dd>
+ <dd><code>srcset</code> enthält mehrere – durch Kommata getrennte – Einträge, jeweils bestehend aus:
+ <ol>
+ <li>einer URL,</li>
+ <li>optional, Leerzeichen gefolgt von einem Kennwert:
+ <ul>
+ <li>der tatsächlichen Breite dieser Quelle (positive Ganzzahl) gefolgt von dem Buchstaben <code>w</code>. Dieser Wert steht in Abhängigkeit zu den Einträgen im <code>sizes</code>-Attribut.</li>
+ <li>eine abstrakte Pixeldichte in Form einer positiven Kommazahl gefolgt von dem Buchstaben <code>x</code>.</li>
+ </ul>
+ </li>
+ </ol>
+
+ <p>Ist kein Kennwert gegeben, wird für die jeweilige Quelle <code>1x</code> angenommen.</p>
+
+ <p>Breitenangaben und Pixeldichten dürfen nicht gleichzeitig verwendet werden.  Doppelte Kennwerte (zum Beispiel zwei Quellen desselben <code>srcset</code>-Attributs mit dem Kennwert '<code style="font-style: normal;">4x</code>') sind ebenfalls nicht erlaubt.</p>
+
+ <p>Die Entscheidung, welche Quelle genutzt wird, obliegt alleine dem Browser. Neben den Eigenschaften der Anzeige können so auch Benutzereinstellungen oder die Internetverbindung berücksichtigt werden.</p>
+ </dd>
+ <dt>{{htmlattrdef("width")}}</dt>
+ <dd>Breite der Grafik in {{HTMLVersionInline(5)}} CSS-Pixeln, {{HTMLVersionInline(4)}} Bildschirmpixeln oder als prozentuale Angabe.</dd>
+ <dt>{{htmlattrdef("usemap")}}</dt>
+ <dd>Verweissensitive Grafik; das usemap-Attribut enthält das URL-Fragment (beginnend mit '#') der zugehörigen <a href="/en-US/docs/HTML/Element/map" title="HTML/Element/Map">Karte</a>.
+ <div class="note">
+ <p><strong>Hinweis: </strong><code>usemap</code> kann nicht benutzt werden, falls sich das <code>&lt;img&gt;</code>-Element in einem {{htmlelement("a")}}- oder  {{HTMLElement("button")}}-Element befindet. Die Verwendung würde mit <code>ismap</code> kollidieren.</p>
+ </div>
+ </dd>
+ <dt>{{htmlattrdef("vspace")}} {{deprecatedGeneric('inline','HTML4.01')}}, {{obsoleteGeneric('inline','HTML5')}}</dt>
+ <dd>Breite des Innenabstands über und unter der Grafik. Benutzen Sie stattdessen die CSS-Eigenschaften {{cssxref('padding-top')}} und {{cssxref('padding-bottom')}} bzw. {{cssxref('padding')}}.</dd>
+</dl>
+
+<h2 id="Unterstützte_Grafikformate">Unterstützte Grafikformate</h2>
+
+<p>Der HTML-Standard gibt nicht vor, welche Grafikformate unterstützt werden müssen. JPEG und GIF sind in allen grafischen Browsern zu finden, ebenso mittlerweile das etwas jüngere PNG. Die Unterstützung für SVG ist beim Internet Explorer und älteren Android-Versionen nur rudimentär vorhanden, breite Unterstützung gibt es erst durch seit 2015 erschienene Browser (insbesondere des Internet-Explorer-Nachfolgers Edge).</p>
+
+<p>Gecko unterstützt die folgenden Formate:</p>
+
+<ul>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/JPEG" title="http://en.wikipedia.org/wiki/JPEG">JPEG</a></li>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/Graphics_Interchange_Format" title="http://en.wikipedia.org/wiki/Graphics_Interchange_Format">GIF</a>, einschließlich animierter</li>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/Portable_Network_Graphics" title="http://en.wikipedia.org/wiki/Portable_Network_Graphics">PNG</a></li>
+ <li><a href="/en-US/docs/Animated_PNG_graphics" title="Animated PNG graphics">APNG</a> {{gecko_minversion_inline("1.9.2")}}</li>
+ <li><a href="/en-US/docs/SVG" title="SVG">SVG</a> {{gecko_minversion_inline("2.0")}}</li>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/BMP_file_format" title="http://en.wikipedia.org/wiki/BMP_file_format">BMP</a></li>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/ICO_%28file_format%29" title="http://en.wikipedia.org/wiki/ICO_%28file_format%29">BMP ICO</a></li>
+ <li><a class="external" href="http://en.wikipedia.org/wiki/ICO_%28file_format%29" title="http://en.wikipedia.org/wiki/ICO_%28file_format%29">PNG ICO</a> {{gecko_minversion_inline("9.0")}}</li>
+</ul>
+
+<div class="note">
+<p><strong>Hinweis:</strong> Das <a class="external" href="http://en.wikipedia.org/wiki/X_BitMap" title="http://en.wikipedia.org/wiki/X_BitMap">XBM</a>-Format wird seit Gecko 1.9.2 nicht mehr unterstützt.</p>
+</div>
+
+<h2 id="Beeinflussung_durch_CSS">Beeinflussung durch CSS</h2>
+
+<p>CSS behandelt <code>&lt;img&gt;</code> als <a href="/en-US/docs/CSS/Replaced_element" title="CSS/Replaced_element">ersetztes Element</a>.</p>
+
+<p>Bei der Verwendung im <code>inline</code>-Modus zusammen mit {{cssxref("vertical-align")}}<code>: baseline</code> wird die Unterkante der Grafik an der Grundline des Elternelements ausgerichtet, da die Grafik selbst keine Grundline besitzt.</p>
+
+<p>Ob eine Grafik festgelegte Abmessungen, d.h. Breite und Höhe hat, hängt vom Grafiktyp ab. SVG-Grafiken verfügen zum Beispiel nicht unbedingt darüber, sie erhalten ihre tatsächlichen Abmessungen aus ihrer Verwendung.</p>
+
+<h2 id="Fehlerbehandlung">Fehlerbehandlung</h2>
+
+<p>Schlägt die Übertragung oder Darstellung der Grafik fehl, wird die wurde mittels {{htmlattrxref("onerror")}} festgelegte Ereignisbehandlung ausgeführt. Mögliche Ursachen sind unter anderem:</p>
+
+<ul>
+ <li>Das {{htmlattrxref("src", "img")}}-Attribute ist leer oder <code>null</code>.</li>
+ <li>Die für <code>src</code> angegebene URL ist die gleiche wie die des Dokuments.</li>
+ <li>Die Grafikdaten sind unlesbar beschädigt oder auch nur, falls weder <code>width</code> noch <code>height</code> angegeben sind, in einer Weise, die es unmöglich macht, Abmessungen auszulesen.</li>
+ <li>Das Grafikformat wird vom {{Glossary("Browser")}} nicht unterstützt.</li>
+</ul>
+
+<h2 id="Beispiel_1">Beispiel 1</h2>
+
+<pre class="brush: html">&lt;img src="mdn-logo-sm.png" alt="MDN"&gt;
+</pre>
+
+<p><img alt="MDN" src="https://developer.cdn.mozilla.net/media/img/mdn-logo-sm.png"></p>
+
+<h2 id="Beispiel_2_Anklickbare_Grafik_als_Verweis">Beispiel 2: Anklickbare Grafik als Verweis</h2>
+
+<pre class="brush: html">&lt;a href="https://developer.mozilla.org/"&gt;&lt;img src="mdn-logo-sm.png" alt="MDN"&gt;&lt;/a&gt;</pre>
+
+<p><a href="https://developer.mozilla.org/"><img alt="MDN" src="https://developer.cdn.mozilla.net/media/img/mdn-logo-sm.png"> </a></p>
+
+<h2 id="Beispiel_3_Das_srcset-Attribut">Beispiel 3: Das <code>srcset</code>-Attribut</h2>
+
+<p>Das <code>src</code>-Attribut hat als Vorgabe den Wert <code>1x</code> bei Browsern, die <code>srcset</code> unterstützen.</p>
+
+<pre class="brush: html"> &lt;img src="mdn-logo-sm.png"
+ alt="MDN"
+ srcset="mdn-logo-HD.png 2x"&gt;</pre>
+
+<h2 id="Beispiel_4_Die_Benutzung_von_srcset_und_size">Beispiel 4: Die Benutzung von <code>srcset</code> und <code>size </code></h2>
+
+<p>Browser, die <code>srcset</code> unterstützen, ignorieren <code>src</code> bei der Benutzung des Bezeichners '<code>w</code>'. Trifft im Beispiel die Bedingung <code>(min-width: 600px)</code> zu, ist die Grafik 200px breit, andernfalls 50vw (50% der Breite des Anzeigegeräts).</p>
+
+<pre class="brush: html" style="font-size: 14px;"> &lt;img src="clock-demo-thumb-200.png"
+ alt="Clock"
+ srcset="clock-demo-thumb-200.png 200w, clock-demo-thumb-400.png 400w"
+  sizes="(min-width: 600px) 200px, 50vw"&gt;</pre>
+
+<h2 id="Specifications" name="Specifications">Spezifikationen</h2>
+
+<table class="standard-table">
+ <thead>
+ <tr>
+ <th scope="col">Spezifikation</th>
+ <th scope="col">Status</th>
+ <th scope="col">Hinweis</th>
+ </tr>
+ </thead>
+ <tbody>
+ <tr>
+ <td>{{SpecName('Referrer Policy', '#referrer-policy-delivery-referrer-attribute', 'referrer attribute')}}</td>
+ <td>{{Spec2('Referrer Policy')}}</td>
+ <td>Attribut <code>referrer</code> hinzugefügt.</td>
+ </tr>
+ <tr>
+ <td>{{SpecName('HTML WHATWG', 'embedded-content.html#the-img-element', '&lt;img&gt;')}}</td>
+ <td>{{Spec2('HTML WHATWG')}}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('HTML5 W3C', 'embedded-content-0.html#the-img-element', '&lt;img&gt;')}}</td>
+ <td>{{Spec2('HTML5 W3C')}}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('HTML4.01', 'struct/objects.html#h-13.2', '&lt;img&gt;')}}</td>
+ <td>{{Spec2('HTML4.01')}}</td>
+ <td> </td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Browser_compatibility" name="Browser_compatibility">Browserkompatibilität</h2>
+
+<p>{{CompatibilityTable}}</p>
+
+<div id="compat-desktop">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Eigenschaft</th>
+ <th>Chrome</th>
+ <th>Edge</th>
+ <th>Firefox (Gecko)</th>
+ <th>Internet Explorer</th>
+ <th>Opera</th>
+ <th>Safari (WebKit)</th>
+ </tr>
+ <tr>
+ <td>&lt;img&gt;</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ </tr>
+ <tr>
+ <td><code>srcset</code> </td>
+ <td>{{CompatChrome(34.0)}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatGeckoDesktop("32.0")}} (behind a pref)</td>
+ <td>{{CompatNo}}</td>
+ <td>{{CompatOpera(21)}}</td>
+ <td>{{CompatSafari(7.1)}}</td>
+ </tr>
+ <tr>
+ <td><code>referrer</code> </td>
+ <td>{{CompatChrome(46.0)}} [1]</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatGeckoDesktop("42.0")}} (behind a pref)</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ </tr>
+ </tbody>
+</table>
+</div>
+
+<div id="compat-mobile">
+<table class="compat-table">
+ <tbody>
+ <tr>
+ <th>Eigenschaft</th>
+ <th>Android</th>
+ <th>Android Webview</th>
+ <th>Firefox Mobile (Gecko)</th>
+ <th>IE Phone</th>
+ <th>Opera Mobile</th>
+ <th>Safari Mobile</th>
+ <th>Chrome for Android</th>
+ </tr>
+ <tr>
+ <td>Basic support</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ <td>{{CompatVersionUnknown}}</td>
+ </tr>
+ <tr>
+ <td><code>srcset</code> </td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatChrome(34.0)}}</td>
+ <td>{{CompatNo}}</td>
+ <td>{{CompatNo}}</td>
+ <td>21</td>
+ <td>iOS 8</td>
+ <td>{{CompatChrome(34.0)}}</td>
+ </tr>
+ <tr>
+ <td><code>referrer</code></td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatChrome(46.0)}} [1]</td>
+ <td>{{CompatGeckoMobile("42.0")}} (behind a pref)</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatUnknown}}</td>
+ <td>{{CompatChrome(46.0)}} [1]</td>
+ </tr>
+ </tbody>
+</table>
+
+<p>[1] Zuschaltbar als <code>referrerpolicy</code> implementiert.</p>
+</div>
+
+<h2 id="Siehe_auch">Siehe auch</h2>
+
+<ul>
+ <li>HTML-Elemente {{HTMLElement("picture")}}, {{HTMLElement("object")}} und {{HTMLElement("embed")}}.</li>
+</ul>
+
+<div> </div>