> For the complete documentation index, see [llms.txt](https://docs.does.qa/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.does.qa/elements/selector-types/css.md).

# CSS

CSS selectors find Elements by tag, class, ID, attributes, and hierarchy. They use the same syntax as stylesheets and are fast to write when the page structure is stable.

Use CSS when classes, IDs, or attributes clearly identify the control. When your application exposes dedicated test attributes, prefer [Test ID](/elements/selector-types/test-id.md) for longer-lasting tests.

See [Creating Elements](/elements/creating-elements.md) to add a Manual Element with a CSS selector.

**Examples:**

* `button.primary`
* `#submit-button`
* `input[name="email"]`
* `div.container > ul > li:first-child`

When the control sits inside Shadow DOM, prefix the CSS with `>>>`. See [Shadow DOM](/elements/selector-types/shadow-dom.md).

## Related

* [Shadow DOM](/elements/selector-types/shadow-dom.md)
* [Test ID](/elements/selector-types/test-id.md)
* [XPath](/elements/selector-types/xpath.md)
* [Visible Text](/elements/selector-types/visible-text.md)
* [Creating Elements](/elements/creating-elements.md)
* [Choose durable selectors](/better-coverage/choose-durable-selectors.md)