实例代码“Ctrl+/”提示“F11/ESC”全屏 返回 格式化 恢复 运行
​x
 
1
<!DOCTYPE html>
2
<html>
3
<body>
4
​
5
<svg xmlns="https://www.w3.org/2000/svg" version="1.1">
6
  <defs>
7
    <filter id="Erode1">
8
      <feMorphology operator="erode" in="SourceGraphic" radius="1" />
9
    </filter>
10
    <filter id="Erode3">
11
      <feMorphology operator="erode" in="SourceGraphic" radius="3" />
12
    </filter>
13
    <filter id="Erode4">
14
      <feMorphology operator="erode" in="SourceGraphic" radius="4" />
15
    </filter>
16
    <filter id="Dilate1">
17
      <feMorphology operator="dilate" in="SourceGraphic" radius="1" />
18
    </filter>
19
    <filter id="Dilate3">
20
      <feMorphology operator="dilate" in="SourceGraphic" radius="3" />
21
    </filter>
22
    <filter id="Dilate4">
23
      <feMorphology operator="dilate" in="SourceGraphic" radius="4" />
24
    </filter>
25
  </defs>
26
  <g enable-background="new">
27
    <g font-family="Verdana" font-size="50" stroke="red" stroke-width="4">
28
      <text x="50" y="60">Unfiltered</text>
29
      <text x="50" y="120" filter="url(#Erode1)">Erode 1</text>
30
      <text x="50" y="180" filter="url(#Erode3)">Erode 3</text>
31
      <text x="50" y="240" filter="url(#Erode4)">Erode 4</text>
32
      <text x="50" y="300" filter="url(#Dilate1)">Dilate 1</text>
33
      <text x="50" y="360" filter="url(#Dilate3)">Dilate 3</text>
34
      <text x="50" y="420" filter="url(#Dilate4)">Dilate 4</text>
35
    </g>
36
  </g>
37
</svg>
38
​
39
</body>
40
</html>