3. Adjacent Sibling Selector: Select elements through their adjacent sibling relationships.

h1 + p {  
color: red;
}

In the above example, the

element immediately following the

element will be selected and the text color will be set to red.

4. General Sibling Selector: Select elements through their sibling relationship.

h1 ~ p {  
font-style: italic;
}

Copy after login

In the above example, all

elements located after the

element will be selected and the font style will be set to italic.

These relational selectors can help us select elements more accurately and apply styles based on the specific relationship between them. By rationally using relational selectors, we can flexibly control the style of elements on the page.