What are the basic selectors of css?

The basic selectors of CSS are used to match elements in HTML documents, including: type selector (matching element name); class selector (matching class name); ID selector (matching ID); descendant selector (matches descendant elements within ancestor elements); child element selector (matches direct child elements); adjacent sibling selector (matches directly adjacent sibling elements); universal sibling selector (matches all sibling elements); attribute selector (matches elements with the specified attribute).

Basic selectors in CSS

Basic selectors in CSS are used to match elements in an HTML document. By using these selectors, you can specify styles for specific elements.

Type selector

• #element: Matches all elements with the specified element name, such as p means all paragraphs.

Class selector

• .class-name: Matches all elements with the specified class name, such as .example represents all elements with class example.

ID selector

• #id-name: Matches a single element with the specified ID, such as #header represents an element with the ID header.

Descendant selector

• ancestor descendant: Matches descendant elements located within ancestor elements, such as ul li represents all li elements located within the ul element.

Child element selector

• ##parent > child: Matches child elements that are direct children of the parent element, For example, div > p means all p elements directly located within the div element.

Adjacent sibling selector

• element adjacent: Match adjacent elements that appear directly after the specified element, For example, p h2 means all h2 elements directly following the p element.

Universal sibling selector

• element ~ sibling: Matches all sibling elements that appear after the specified element, including Adjacent elements and further elements, for example h1 ~ p means all p elements that follow the h1 element.

Attribute selector

• [attribute]: Match elements with specified attributes, such as [href ] represents all elements with the href attribute.
• [attribute=value]: Matches elements with the specified attribute and with the specified value, for example [href="example.com"] means all href Element with attribute value "example.com".

The above is the detailed content of What are the basic selectors of css?. For more information, please follow other related articles on the PHP Chinese website!