CSS中的大于號與小于號表示子元素的選擇器,它們分別為>
和<
。
.parent >.child { /* 選擇父元素為parent的子元素為child */ }
使用大于號選擇器可以減少CSS的樣式匹配范圍,從而提高渲染性能。同時,它也使得CSS代碼更加清晰明了。
/* 不使用大于號 */ .parent .child { /* 選擇父元素為parent的所有子元素及其孫子元素中的.child */ } /* 使用大于號 */ .parent >.child { /* 選擇父元素為parent的直接子元素中的.child */ }
需要注意的是,大于號只能選擇直接子元素,而無法選擇孫子元素和后代元素。若需要選擇下層所有的元素,可以使用空格。
.parent .child { /* 選擇父元素為parent的子元素為child的所有后代元素 */ }
小于號選擇器與大于號相反,表示選擇元素的父元素。但它的使用非常少見,不建議在實際開發中使用。
.child < .parent { /* 選擇父元素為parent的子元素為child */ }