Features

近年來,CSS 湧起新功能。因此,也可以預料到社群還在慢慢地吸收新屬性,採用有點落後。

這張圖表顯示所有功能個別的採用程度,以分類來區別。外圍圓圈的大小代表知道某功能的使用者總數,而內圈代表實際在使用的人數。將滑鼠移到節點上,就可以看到詳細資料,還有代表此問卷答題者總數的區塊

版面安排形狀 & 圖形互動文字排版動畫 & 變形Media Queries其他功能GridGridSubgridSubgridFlexboxFlexboxMulti-Column LayoutMulti-Column LayoutWriting ModesWriting ModesExclusionsExclusionsCSS position:stickyCSS position:stickyCSS Logical PropertiesCSS Logical PropertiesCSS property: aspect-ratioCSS property: aspect-ratioCSS content-visibilityCSS content-visibilityShapesShapesobject-fitobject-fitclip-pathclip-pathMaskingMaskingblend-modeblend-modeFilters & EffectsFilters & Effectsbackdrop-filterbackdrop-filterScroll SnapScroll Snapoverscroll-behavioroverscroll-behavioroverflow-anchoroverflow-anchortouch-actiontouch-actionpointer-eventspointer-events@font-face @font-face Line Breaking PropertiesLine Breaking Propertiesfont-variantfont-variantinitial_letterinitial_letterfont-variant-numericfont-variant-numericfont-displayfont-displayline-clampline-clampTransitionsTransitionsTransformsTransformsAnimationsAnimationsPerspectivePerspectiveprefers-reduced-motionprefers-reduced-motionprefers-color-schemeprefers-color-schemecolor-gamutcolor-gamutVariablesVariables@supports@supportsContainContainwill-changewill-changecalc()calc()CSS HoudiniCSS HoudiniCSS Comparison FunctionsCSS Comparison Functions
有聽過
已經使用

調查裡提到的 CSS 功能裡,有多少答題者知道?

0%3%7%10%13%17%使用者百分比0-10%10-20%20-30%30-40%40-50%50-60%60-70%70-80%80-90%90-100%知道的功能0%3%7%10%13%17%2.6%2.6%5.1%5.1%5%5%9.1%9.1%11.9%11.9%16.7%16.7%16.1%16.1%14%14%13.2%13.2%5.5%5.5%

推薦資源

Learn CSS, from Laying Out Websites to Performant Animations

CSS is rich in capabilities and is more than simply laying out pages! Replace costly JavaScript with CSS.
感謝贊助我們的伙伴! 深入瞭解。