diff options
Diffstat (limited to 'files/de/web/css/@media/width/index.html')
-rw-r--r-- | files/de/web/css/@media/width/index.html | 53 |
1 files changed, 53 insertions, 0 deletions
diff --git a/files/de/web/css/@media/width/index.html b/files/de/web/css/@media/width/index.html new file mode 100644 index 0000000000..7f25285f3e --- /dev/null +++ b/files/de/web/css/@media/width/index.html @@ -0,0 +1,53 @@ +--- +title: width +slug: Web/CSS/@media/width +tags: + - CSS + - Referenz +translation_of: Web/CSS/@media/width +--- +<p>{{cssref}}</p> + +<p><strong><code>width</code></strong> ist eine <a href="/de/docs/Web/CSS">CSS</a> Medien-Eigenschaft, die verwendet werden kann um Stile basierend auf der Breite der Anzeige (Viewport) zuzuordnen. Die Breite muss als {{cssxref("<length>")}} Wert definiert werden.</p> + +<h2 id="Syntax">Syntax</h2> + +<p><strong><code>width</code></strong> ist ein Breichswert, d.h. <strong><code>min-width</code></strong> und <strong>max-width</strong> sind ebenfalls verfügbar.</p> + +<pre class="brush: css">/* Exakte Breite */ +@media (width: 300px) {} + +/* Viewport Minimale Breite */ +@media (min-width: 50em) {} + +/* Viewport Maximale Breite */ +@media (max-width: 1000px) {} +</pre> + +<h2 id="Spezifikationen">Spezifikationen</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Spezifikation</th> + <th scope="col">Status</th> + <th scope="col">Kommentar</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('CSS4 Media Queries', '#media', '@media')}}</td> + <td>{{Spec2('CSS4 Media Queries')}}</td> + <td>Keine Änderung.</td> + </tr> + <tr> + <td>{{SpecName('CSS3 Media Queries', '#width', 'width')}}</td> + <td>{{Spec2('CSS3 Media Queries')}}</td> + <td>Initiale Definition.</td> + </tr> + </tbody> +</table> + +<h2 id="Browser_compatibility" name="Browser_compatibility">Browserkompatibilität</h2> + +{{Compat("css.at-rules.media.width")}} |