CSS clip-path 屬性 (適用於 HTML)

- CR

使用 SVG 或形狀定義來定義 HTML 元素的可見區域的方法。

Chrome

  1. 4 - 23: 不支援
  2. 24 - 54: 部分支援
  3. 55 - 123: 部分支援
  4. 124: 部分支援
  5. 125 - 127: 部分支援

Edge

  1. 12 - 17: 不支援
  2. 18: 預設停用
  3. 79 - 123: 部分支援
  4. 124: 部分支援

Safari

  1. 3.1 - 6.1: 不支援
  2. 7 - 13: 部分支援
  3. 13.1 - 17.3: 部分支援
  4. 17.4: 部分支援
  5. 17.5 - TP: 部分支援

Firefox

  1. 2 - 3: 不支援
  2. 3.5 - 46: 部分支援
  3. 47 - 53: 部分支援
  4. 54 - 124: 支援
  5. 125: 支援
  6. 126 - 128: 支援

Opera

  1. 9 - 12.1: 不支援
  2. 15 - 41: 部分支援
  3. 42 - 108: 部分支援
  4. 109: 部分支援

IE

  1. 5.5 - 10: 不支援
  2. 11: 不支援

Chrome for Android

  1. 124: 部分支援

Safari on iOS

  1. 3.2 - 6.1: 不支援
  2. 7 - 12.5: 部分支援
  3. 13 - 17.3: 部分支援
  4. 17.4: 部分支援
  5. 17.5: 部分支援

Samsung Internet

  1. 4 - 5.4:部分支援
  2. 6.2 - 23:部分支援
  3. 24:部分支援

Opera Mini

  1. 全部:不支援

Opera Mobile

  1. 10 - 12.1:不支援
  2. 80:部分支援

UC Browser for Android

  1. 15.5:部分支援

Android Browser

  1. 2.1 - 4.3:不支援
  2. 4.4 - 4.4.4:部分支援
  3. 124: 部分支援

Firefox for Android

  1. 125: 支援

QQ Browser

  1. 14.9:部分支援

Baidu Browser

  1. 13.52:部分支援

KaiOS Browser

  1. 2.5:部分支援
  2. 3:支援

支援特別是指 HTML 元素上的 clip-path CSS 屬性。所有支援 基本 SVG 的瀏覽器都支援 SVG 中的 clip-path

資源
外部 SVG 中形狀的 Chromium 錯誤
外部 SVG 中形狀的 WebKit 錯誤
使用多邊形裁剪影像的 Codepen 範例
CSS Tricks 文章
視覺測試案例