CSS (Cascading Style Sheets) is a stylesheet language used to describe the presentation of a document written in HTML or XML. The three types of CSS are Inline CSS, Internal CSS, and External CSS.

Relative: The element is positioned relative to its normal position. Absolute: The element is positioned relative to its nearest positioned ancestor. Fixed: The element is positioned relative to the viewport and does not move when scrolling. Sticky: The element toggles between relative and fixed based on scroll position.

Inline: Elements do not start on a new line and occupy only the width necessary. Block: Elements start on a new line and take up the full width available. Inline-block: Combines inline behavior but allows setting height and width.

Pseudo-classes define the special state of an element. For example, :hover applies a style when the user hovers over an element.

em: Relative to the font-size of its nearest parent. rem: Relative to the root element's font size.

Media queries are used to apply styles based on device properties, such as width, height, orientation, and resolution.

visibility: hidden: The element is invisible but still takes up space. display: none: The element is removed from the layout and does not take up any space.

Absolute units (e.g., px, cm): Fixed and not relative to anything else. Relative units (e.g., %, em): Based on another element, such as a parent or the root.

Flexbox: A layout model designed for one-dimensional layouts, either row or column. Grid: A two-dimensional layout system for rows and columns.

Keyframe animations define the intermediate steps in an animation sequence. Using @keyframes, you can specify the styles at various points during the animation.