CSS中关系选择器包括5大类&＃xff0c;分别为&＃xff1a;

1.多元素选择器&＃xff08;A&＃xff0c;B&＃xff09;&＃xff1a;同时对A&＃xff0c;B元素定义相同的样式&＃xff0c;这样可以省去分别去定义A&＃xff0c;B而得到相同的效果。

2.后代元素选择器&＃xff08;A B&＃xff09;&＃xff1a;B和A是嵌套关系&＃xff0c;且B是A的后代&＃xff08;儿子&＃xff0c;孙子&＃xff0c;重孙子……都无所谓&＃xff09;。

3.子元素选择器&＃xff08;A > B&＃xff09;&＃xff1a;B和A是嵌套关系&＃xff0c;且B是A的儿子。

4.毗邻后兄弟选择器&＃xff08;A &＃43; B&＃xff09;&＃xff1a;B和A是同级关系&＃xff0c;且B是A的下一个相邻的元素。

5.同级后兄弟选择器&＃xff08;A ~ B&＃xff09;&＃xff1a;B和A是同级关系&＃xff0c;且B是A的下面相邻的一个或多个元素。

下面为CSS代码演示&＃xff1a;

人生0

人生1

人生2

人生3

人生4

Chrome浏览器展示效果&＃xff1a;