CSS层次选择器是指选择元素时,根据元素的父级、子级或兄弟级之间的关系来选取的一种选择器,一共有三种:父子选择器 父子选择器用于选取某个元素的子元素,选择器为“父元素 子元素”,中间用空格隔开。例如:
CSS层次选择器是指选择元素时,根据元素的父级、子级或兄弟级之间的关系来选取的一种选择器,一共有三种:
父子选择器
父子选择器用于选取某个元素的子元素,选择器为“父元素 子元素”,中间用空格隔开。例如:
ul li { color: red; }
上面的代码将会选择所有ul元素下的li元素,并将文字颜色设置为红色。
相邻兄弟选择器
相邻兄弟选择器用于选取紧跟在另一个元素后面的元素,选择器为“元素1 + 元素2”,中间用加号隔开,例如:
h1 + p { color: blue; }
上面的代码将会选择紧跟在h1元素后面的第一个p元素,并将文字颜色设置为蓝色。
通用兄弟选择器
通用兄弟选择器用于选取在另一个元素后面的所有元素,选择器为“元素1 ~ 元素2”,中间用波浪线隔开。例如:
h2 ~ p { color: green; }
上面的代码将会选择所有紧跟在h2元素后面的p元素,并将文字颜色设置为绿色。
粉丝
0
关注
0
收藏
0