在css選擇器練習第十二關中,我們需要根據指定的要求來編寫選擇器,以達到預期效果。
/* 要求一:選中class為box的所有元素的直接子元素p,并將其字體顏色設置為紅色 */ .box >p { color: red; } /* 要求二:選中id為list中的第2個li元素,并將其背景顏色設置為黑色 */ #list li:nth-of-type(2) { background-color: black; } /* 要求三:選中class為test的div元素中所有的ul元素,且ul元素的序號為偶數,并將它們的背景顏色設置為綠色 */ .test ul:nth-of-type(even) { background-color: green; } /* 要求四:選中第一個子元素為img的p元素,并將它們的邊框設置為1px的紅色實線 */ p >img:first-child { border: 1px solid red; }
通過以上代碼,我們可以看到如何使用各種選擇器來指定不同的元素,并修改它們的樣式。熟練掌握css選擇器的使用,可以讓我們更方便地操作DOM,快速修改網頁樣式,提高開發效率。