Shulou(Shulou.com)06/03 Report--

This article will explain in detail how to use the brother selector in css. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

Mainly explain the use of sibling selector in css, and what are the differences between + and ~? If you need to select an element immediately after another element, and the two have the same parent element, you can use the adjacent sibling selector.

+ the use of selector

For example:

H _ 2j _ p {

Margin-top:50px

Color:red

}

Thisisparagraph.

Thisisaheading.

Thisisparagraph.

Thisisparagraph.

The effect picture is as follows:

The brother selector will only affect the style of the p tag below, not the style of the brother above.

Note that the meaning of'+ 'here is different from that of' and'. The style of the sibling selector is applied to the sibling element and has nothing to do with the style of the referenced element. for example, the above example only affects the style of the p element and does not affect the style of the H2 tag. Of course, this will also loop, that is, when two sibling elements are the same, there will be a loop search:

Li+li {

Color:red

}

Listitem1

Listitem2

Listitem3

The effect is as follows:

Listitem1

Listitem2

Listitem3

You can see that the first li font color does not turn red, and the second and third element fonts turn red, which is because the third li is a sibling of the second li, so styles are also applied.

~ the use of selector

The function is to find all sibling nodes that follow a specified element. Sample code:

H _ 2j _ p {

Color:red

}

one

two

three

four

five

This is the end of the article on "how to use the Brother Selector in css". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.