CSS3偽類是在CSS3中新增的一個很方便的功能,可以讓我們在選擇元素時更加靈活。下面是使用CSS3偽類的一些技巧:
/* 1. 使用:hover實現懸停效果 */ a:hover { color: red; } /* 2. 使用:first-child選擇第一個子元素 */ ul li:first-child { font-weight: bold; } /* 3. 使用:last-child選擇最后一個子元素 */ ul li:last-child { font-style: italic; } /* 4. 使用:nth-child選擇指定位置的子元素 */ ul li:nth-child(2) { color: green; } /* 5. 使用:not排除某些元素 */ ul li:not(:first-child) { text-decoration: underline; } /* 6. 使用:empty選擇沒有子元素的元素 */ div:empty { background-color: gray; } /* 7. 使用:target選擇錨點目標元素 */ div:target { border: 1px solid blue; }
以上就是一些CSS3偽類的使用技巧,希望能對大家有所幫助。