What are browser styles, user styles, and author styles in CSS?

In CSS, there are several levels of styles that apply to page elements and have different priorities:

• Browser Styles (User Agent Styles) — these are the default styles set by the browser for HTML elements. For example, the browser sets margins for headings, link colors, etc. If not overridden, these styles will be applied.

• User Styles — styles that the user can set through browser settings or custom CSS files. They have a higher priority than browser styles and allow the user to modify the display of pages for their needs (e.g., increase font size or change colors for easier reading).

• Author Styles — styles set by the website developer in CSS files or inline styles. They have a higher priority than browser and user styles (except when the user explicitly sets important styles with !important).

Default priority hierarchy:

User Agent Styles < User Styles < Author Styles

Example:

/* Author styles */
p { color: blue; }

If the browser defaults to black color for <p> and the user hasn't changed styles, the text will be blue. If the user sets their styles with !important, they can override the author styles.