The best CSS bottom Property Tutorial In 2024, In this tutorial you can learn Examples,Attribute definitions and instructions,Browser Support,Property Value,related articles,

CSS bottom Property

Examples

Set the image of the bottom edge, the bottom edge of the top element in 5px:

img
{
position:absolute;
bottom:5px;
}


Attribute definitions and instructions

For absolutely positioned elements, bottom property setting unit above / below the bottom edge of the containing element.

For relatively positioned elements, bottom property setting unit above / below the bottom edge of its normal position of the element.

Note: If the"position: static", the bottom of the property does not have any effect.

Note: For static element, one auto; for length values, compared with the corresponding absolute length; for percentage values, the specified value; otherwise auto.Relative definitions element, if bottom and top are auto, then the calculated value is 0; if one of them is auto, then take another opposite number value; if neither is auto, bottom will take the top value Opposite number.

Defaults: auto
Inherited: no
version: CSS2
JavaScript syntax: object .style.bottom = "50px"


Browser Support

Figures in the table represent the first browser to support the version number of the property.

属性
bottom 1.0 5.0 1.0 1.0 6.0

Property Value

value description
auto Defaults. Calculating a position at the bottom of the browser.
% Set as a percentage of the containing element gauge bottom position. You can use a negative value.
length Use px, cm, and other units set up base position of the element. You can use a negative value.
inherit Provisions should inherit the property value from the bottom of the parent element.


related articles

CSS tutorial: CSS Positioning

CSS bottom Property
10/30