CSS - Eigenschaft unten
Beispiel
Stellen Sie die untere Kante des <div>-Elements auf 10 Pixel über der unteren Kante des nächsten übergeordneten Elements mit einer gewissen Positionierung ein:
div.absolute {
position: absolute;
bottom:
10px;
width: 50%;
border: 3px solid #8AC007;
}
Definition und Verwendung
Die bottomEigenschaft wirkt sich auf die vertikale Position eines positionierten Elements aus. Diese Eigenschaft hat keine Auswirkung auf nicht positionierte Elemente.
- Wenn Position: absolut; oder Position: fest; - Die
bottomEigenschaft setzt den unteren Rand eines Elements auf eine Einheit über/unter dem unteren Rand seines nächsten positionierten Vorfahren. - Wenn Position: relativ; - Die
bottomEigenschaft bewirkt, dass sich der untere Rand des Elements über/unter seine normale Position bewegt. - Wenn Position: klebrig; - Die
bottomEigenschaft verhält sich so, als wäre ihre Position relativ, wenn sich das Element innerhalb des Ansichtsfensters befindet, und als wäre ihre Position fixiert, wenn es sich außerhalb befindet. - Wenn Position: statisch; - Die
bottomEigenschaft hat keine Auswirkung.
| Standardwert: | Auto |
|---|---|
| Vererbt: | Nein |
| Animierbar: | ja. Lesen Sie mehr über animierbare |
| Ausführung: | CSS2 |
| JavaScript-Syntax: | Objekt .style.bottom="10px" |
Browser-Unterstützung
Die Zahlen in der Tabelle geben die erste Browserversion an, die die Eigenschaft vollständig unterstützt.
| Property | |||||
|---|---|---|---|---|---|
| bottom | 1.0 | 5.0 | 1.0 | 1.0 | 6.0 |
CSS-Syntax
bottom: auto|length|initial|inherit;
Eigenschaftswerte
| Value | Description | Play it |
|---|---|---|
| auto | Lets the browser calculate the bottom edge position. This is default | |
| length | Sets the bottom edge position in px, cm, etc. Negative values are allowed. Read about length units | |
| % | Sets the bottom edge position in % of containing element. Negative values are allowed | |
| initial | Sets this property to its default value. Read about initial | |
| inherit | Inherits this property from its parent element. Read about inherit |
Verwandte Seiten
CSS-Tutorial: CSS-Positionierung
CSS-Referenz: Top-Eigenschaft
CSS-Referenz: linke Eigenschaft
CSS-Referenz: richtige Eigenschaft
HTML-DOM-Referenz: Bottom-Eigenschaft