Units
This lesson discusses CSS Units and their usage.
Units
In CSS, there are different units that can be used to define the size of elements. Some of the common units include:
- Pixels (px) - Pixels are a fixed unit of measurement that is used to define the size of elements in terms of screen pixels. Pixels are an absolute unit and do not change based on the screen size.
- Percent (%) - Percentages are a relative unit of measurement that is used to define the size of elements as a percentage of the parent element. Percentages are relative to the parent element and change based on the size of the parent element.
- Em (em) - Em is a relative unit of measurement that is used to define the size of elements relative to the font size of the parent element. Em is relative to the font size of the parent element and changes based on the font size of the parent element.
- Rem (rem) - Rem is a relative unit of measurement that is used to define the size of elements relative to the font size of the root element (html). Rem is relative to the font size of the root element and does not change based on the font size of the parent element.
- Viewport Width (vw) - Viewport width is a relative unit of measurement that is used to define the size of elements relative to the width of the viewport. Viewport width is relative to the width of the viewport and changes based on the size of the viewport.
- Viewport Height (vh) - Viewport height is a relative unit of measurement that is used to define the size of elements relative to the height of the viewport. Viewport height is relative to the height of the viewport and changes based on the size of the viewport.