From 4b1a9203c547c019fc5398082ae19a3f3d4c3efe Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:41:15 -0500 Subject: initial commit --- files/de/web/css/height/index.html | 157 +++++++++++++++++++++++++++++++++++++ 1 file changed, 157 insertions(+) create mode 100644 files/de/web/css/height/index.html (limited to 'files/de/web/css/height/index.html') diff --git a/files/de/web/css/height/index.html b/files/de/web/css/height/index.html new file mode 100644 index 0000000000..8360676aa8 --- /dev/null +++ b/files/de/web/css/height/index.html @@ -0,0 +1,157 @@ +--- +title: height +slug: Web/CSS/height +tags: + - CSS + - CSS Eigenschaft + - Referenz +translation_of: Web/CSS/height +--- +
{{CSSRef}}
+ +

Übersicht

+ +

Die height CSS Eigenschaft bestimmt die Höhe des Inhaltsbereichs eines Elements. Der Inhaltsbereich ist innerhalb des Innenabstands, der Rahmen und des Außenabstands des Elements.

+ +

Die Eigenschaften {{cssxref("min-height")}} und {{cssxref("max-height")}} überschreiben height.

+ +

{{cssinfo}}

+ +

Syntax

+ +
/* Schlüsselwortwert */
+height: auto;
+
+/* <length> Werte */
+height: 120px;
+height: 10em;
+
+/* <percentage> Wert */
+height: 75%;
+
+/* Globale Werte */
+height: inherit;
+height: initial;
+height: unset;
+
+ +

Werte

+ +
+
<length>
+
Siehe {{cssxref("<length>")}} für mögliche Einheiten.
+
<percentage>
+
Definiert als eine {{cssxref("<percentage>")}} der Höhe des beinhaltenden Blocks.
+
border-box {{experimental_inline}}
+
Falls angegeben, wird die vorhergehende {{cssxref("<length>")}} oder {{cssxref("<percentage>")}} auf die Rahmenbox des Elements angewendet.
+
content-box {{experimental_inline}}
+
Falls angegeben, wird die vorhergehende {{cssxref("<length>")}} oder {{cssxref("<percentage>")}} auf die Inhaltsbox des Elements angewendet.
+
auto
+
Der Browser berechnet und wählt die Höhe für das angegebene Element aus.
+
max-content {{experimental_inline}}
+
Die innere bevorzugte Höhe.
+
min-content {{experimental_inline}}
+
Die innere Minimalhöhe.
+
available {{experimental_inline}}
+
Die Höhe des beinhaltenden Blocks minus vertikaler Außenabstand, Rahmen und Innenabstand.
+
fit-content {{experimental_inline}}
+
Die größere der: +
    +
  • inneren Minimalhöhe
    • +
  • kleineren der inneren bevorzugten und der verfügbaren Höhe
    • +
+
+
+ +

Formale Syntax

+ +
{{csssyntax}}
+ +

Beispiel

+ +

HTML

+ +
<div id="red">
+  <span>Ich bin 50 Pixel hoch.</span>
+</div>
+<div id="green">
+  <span>Ich bin 25 Pixel hoch.</span>
+</div>
+<div id="parent">
+  <div id="child">
+    <span>Ich bin halb so groß wie mein Elternelement.</span>
+  </div>
+</div>
+
+ +

CSS

+ +
div {
+  width: 250px;
+  margin-bottom: 5px;
+  border: 3px solid #999999;
+}
+
+#red {
+  height: 50px;
+}
+
+#green {
+  height: 25px;
+}
+
+#parent {
+  height: 100px;
+}
+
+#child {
+  height: 50%;
+  width: 75%;
+}
+
+ +

{{EmbedLiveSample('Beispiel')}}

+ +

Spezifikationen

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
SpezifikationStatusKommentar
{{SpecName('CSS3 Box', '#the-width-and-height-properties', 'height')}}{{Spec2('CSS3 Box')}}Fügt die Schlüsselwörter max-content, min-content, available, fit-content, border-box und content-box hinzu.
{{SpecName('CSS3 Transitions', '#animatable-css', 'height')}}{{Spec2('CSS3 Transitions')}}Definiert height als animierbar.
{{SpecName('CSS2.1', 'visudet.html#the-height-property', 'height')}}{{Spec2('CSS2.1')}}Fügt Unterstützung für {{cssxref("<length>")}} Werte hinzu und präzisiert, für welche Elemente die Eigenschaft gilt.
{{SpecName('CSS1', '#height', 'height')}}{{Spec2('CSS1')}}Ursprüngliche Definition
+ +

Browser Kompatibilität

+ +{{Compat("css.properties.height")}} + +

Siehe auch

+ + -- cgit v1.2.3-54-g00ecf