CSS3中提供了兄弟選擇符,它可以選擇某個元素之后的相鄰元素,同時也可以選擇其之后的所有兄弟元素。使用兄弟選擇符可以讓我們更方便地對一組元素進行樣式設置,并且不需要給每個元素單獨設置樣式。
/* 選中所有緊跟在p元素后面的使用了em標簽的元素 */ p + em { color: red; } /* 選中p元素后面所有元素中使用了em標簽的元素 */ p ~ em { color: blue; }
上面的代碼演示了使用兄弟選擇符的兩種方式。第一種方式使用“+”符號來選中緊跟在p元素后面的使用了em標簽的元素,并將其文字顏色設置為紅色。第二種方式使用“~”符號來選中p元素后面所有元素中使用了em標簽的元素,并將其文字顏色設置為藍色。
需要注意的是,這些選擇符只能用于選中緊跟在某個元素后面的元素或者是其之后的所有兄弟元素,而無法用于選中它之前的兄弟元素。如果需要選中之前的兄弟元素,可以考慮使用JavaScript或者是其他的CSS選擇符。
上一篇css3 光澤一閃而過
下一篇css3 凹陷的弧度