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 aspmeans all paragraphs.

Class selector

• .class-name: Matches all elements with the specified class name, such as.examplerepresents all elements with classexample.

ID selector

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

Descendant selector

• ancestor descendant: Matches descendant elements located within ancestor elements, such asul lirepresents alllielements located within theulelement.

Child element selector

• ##parent > child: Matches child elements that are direct children of the parent element, For example,div > pmeans allpelements directly located within thedivelement.

Adjacent sibling selector

• element adjacent: Match adjacent elements that appear directly after the specified element, For example,p h2means allh2elements directly following thepelement.

Universal sibling selector

• element ~ sibling: Matches all sibling elements that appear after the specified element, including Adjacent elements and further elements, for exampleh1 ~ pmeans allpelements that follow theh1element.

Attribute selector

• [attribute]: Match elements with specified attributes, such as[href ]represents all elements with thehrefattribute.
• [attribute=value]: Matches elements with the specified attribute and with the specified value, for example[href="example.com"]means allhrefElement 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!