CSS4序列號有很多新特性,以下是其中一些:
1. 新的選擇器 使用新的選擇器可以更方便地選擇元素,例如使用前綴選擇器可以選擇一組屬性中所有以特定前綴開始的屬性,具體實現如下: *[attr^="prefix"] //表示以prefix為前綴的所有屬性 2. 自定義計數器 自定義計數器是一個非常實用的特性,可以在樣式表中定義一個計數器,然后在元素中使用該計數器自動生成有序號的列表。具體實現如下: ul { counter-reset: my-counter; } li:before { counter-increment: my-counter; content: counter(my-counter) '.'; //表示將my-counter的值插入到content內容中 } 3. 內容屬性 在CSS4中,可以使用內容屬性插入一些內容到元素中,例如插入逗號,冒號等符號。具體實現如下: p:before { content: ', '; } p:last-child:before { content: ' and '; } 4. 混合模式 混合模式是一種新的背景效果,可以對背景進行混合效果,例如疊加、正片疊底等。具體實現如下: background-blend-mode: multiply; //表示使用正片疊底合成背景 5. 邊框圖片 可以使用圖片來代替邊框,實現更加豐富的樣式效果。具體實現如下: border-image: url(border.png) 30 30 30 30 repeat; 6. 數學函數 CSS4中新增了一些數學函數,可以進行更復雜的計算,例如pow、sqrt、sin、cos等。具體實現如下: width: calc(100% - 20px); transform: rotate(calc(180deg / 3));
以上是CSS4序列號的一些新特性,可以讓我們在樣式設計中更加靈活和方便。
下一篇css4浮動怎么去除