Day 8 Web Dev

CSS units are used to specify measurements in Cascading Style Sheets (CSS) to define the size, position, and spacing of elements on a web page. There are various types of units available in CSS, each serving a specific purpose. Here are some of the commonly used CSS units:

1. Absolute Units:

   • Pixels (px): Pixels are the most common unit in CSS. They provide a fixed-size measurement relative to the screen's resolution.

   • Points (pt): Points are commonly used for print media. One point is equal to 1/72nd of an inch.

   • Inches (in): Inches represent physical inches on the screen or paper.

   • Centimeters (cm): Centimeters are used to specify physical measurements in CSS.

2. Relative Units:

   • Percent (%): Percentages are relative to the parent element. For example, setting a width of 50% means the element will take up half of its parent's width.

   • Viewport Height (vh) and Viewport Width (vw): These units are relative to the viewport's height and width, respectively. 1vh is equal to 1% of the viewport height, and 1vw is equal to 1% of the viewport width.

   • Relative Font Size (em): The em unit represents the font size of the element relative to its parent's font size. For example, setting font-size: 1.2em means the font size is 1.2 times the parent's font size.

   • Root Font Size (rem): Similar to em, the rem unit represents the font size relative to the root element (usually the <html> element). It allows you to create scalable designs across the entire page.