CSS

移動瀏覽器與桌面瀏覽器對CSS支持的差異：

• 桌面用例在移動端不存在。如hover。
• 視口不統(tǒng)一。如單位vw和vh。
• 對獨(dú)立可滾動層的需求在移動設(shè)備上更難實現(xiàn)。如background-attachment。
• 硬件限制。在老設(shè)備上transition和animation可能無法使用。

以下屬性都不建議在移動Web上使用。

position:fixed

此屬性標(biāo)準(zhǔn)沒有支持縮放。

overflow:auto

多個可滾動層體驗不好，并且移動上默認(rèn)不顯示滾動條會漏掉內(nèi)容。

-webkit-overflow-scrolling:auto：平滑滾動。

background-attachment

三個可選值scroll、fixed、local。會創(chuàng)建過多的可滾動層，影響性能。

尺寸單位vw和vh

非常冷門的單位，本來也沒什么人用，這里就不多說了。

:active和:hover

:hover在桌面瀏覽器用的過多，因此移動設(shè)備必須支持，但實際上在用戶觸摸元素時觸發(fā)，引起事件級聯(lián)。

:active相對支持的不好，可以和:focus同時使用，后者支持的較好。

transition和animation

實際上瀏覽器支持的很好，但這兩個屬性會用到GPU，而移動設(shè)備GPU很糟糕，至少是早期的很糟糕。