remove page macro from some svg documents (#10559)

* remove page macro from some svg documents * Update files/zh-cn/web/svg/attribute/accent-height/index.md * Apply suggestions from code review
mdn · Dec 9, 2022 · abc2a5d · abc2a5d
1 parent df0607e
commit abc2a5d
Show file tree

Hide file tree

Showing 4 changed files with 217 additions and 68 deletions.
diff --git a/files/zh-cn/web/svg/attribute/accent-height/index.md b/files/zh-cn/web/svg/attribute/accent-height/index.md
@@ -3,28 +3,46 @@ title: accent-height
 slug: Web/SVG/Attribute/accent-height
 ---
 
-« 回到 SVG 属性指南首页
+{{SVGRef}}{{deprecated_header}}
 
-此属性定义从原点到重点字符顶部的距离，通过字体坐标系内的距离测量。
+**`accent-height`** 属性定义从原点到重点字符顶部的距离，通过字体坐标系内的距离测量。
 
-若未定义该属性，那么该属性就会被设置为{{ SVGAttr("ascent") }}。
+你可以将该属性与以下 SVG 元素一起使用：
 
-## Usage context
+- {{SVGElement("font-face")}}
 
-| Categories         | None                                                                                              |
-| ------------------ | ------------------------------------------------------------------------------------------------- |
-| Value              | [\<number>](/zh-CN/SVG/Content_type#Length)                                                           |
-| Animatable         | No                                                                                                |
-| Normative document | [SVG 1.1 (2nd Edition)](http://www.w3.org/TR/SVG/fonts.html#FontFaceElementAccentHeightAttribute) |
+## font-face
 
-{{ page("/en-US/docs/SVG/Content_type","Number") }}
+对于 {{SVGElement("font-face")}} 元素，`accent-height` 定义从原点到重音字符顶部的距离，通过字体坐标系内的距离测量。
 
-## Elements
-
-The following elements can use the `accent-height` attribute
-
-- {{ SVGElement("font-face") }}
+<table class="properties">
+  <tbody>
+    <tr>
+      <th scope="row">值</th>
+      <td>
+        <a href="/zh-CN/docs/Web/SVG/Content_type#number">&#x3C;number></a>
+      </td>
+    </tr>
+    <tr>
+      <th scope="row">默认值</th>
+      <td>{{SVGAttr("ascent")}} 的值</td>
+    </tr>
+    <tr>
+      <th scope="row">可变性</th>
+      <td>否</td>
+    </tr>
+  </tbody>
+</table>
 
 ## 规范
 
 {{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
+
+## 参见
+
+- {{SVGAttr("cap-height")}}
+- {{SVGAttr("x-height")}}
diff --git a/files/zh-cn/web/svg/attribute/fy/index.md b/files/zh-cn/web/svg/attribute/fy/index.md
@@ -3,53 +3,144 @@ title: fy
 slug: Web/SVG/Attribute/fy
 ---
 
-« [SVG 属性参考主页](/zh-CN/SVG/Attribute)
+{{SVGRef}}
 
-对于 {{ SVGElement("radialGradient") }} 元素，此属性用来定义径向渐变的焦点的 y 轴坐标。如果该属性没有被定义，就假定它与中心点是同一位置。
+**`fy`** 属性用来定义径向渐变的焦点的 y 轴坐标。
 
-## 用法
-
-| 类别     | 无                                                                                                                           |
-| -------- | ---------------------------------------------------------------------------------------------------------------------------- |
-| 值       | [\<coordinate>](/zh-CN/SVG/Content_type#Coordinate)                                                                              |
-| 可变性   | 非                                                                                                                           |
-| 规范文档 | [SVG 1.1 (2nd Edition): The radialGradient element](http://www.w3.org/TR/SVG/pservers.html#RadialGradientElementCXAttribute) |
+你可以将该属性与以下 SVG 元素一起使用：
 
-{{ page("/en/SVG/Content_type","Coordinate") }}
+- {{SVGElement("radialGradient")}}
 
 ## 示例
 
-```html
-<?xml version="1.0" standalone="no"?>
+### 示例 1
 
-<svg width="120" height="120" version="1.1"
-  xmlns="http://www.w3.org/2000/svg">
+```css hidden
+html,
+body,
+svg {
+  height: 100%;
+}
+```
+
+```html
+<svg viewBox="0 0 480 200" xmlns="http://www.w3.org/2000/svg">
   <defs>
-      <radialGradient id="Gradient"
-            cx="0.5" cy="0.5" r="0.5" fx="0.25" fy="0.25">
-        <stop offset="0%" stop-color="red"/>
-        <stop offset="100%" stop-color="blue"/>
-      </radialGradient>
+    <radialGradient
+      id="gradient1"
+      cx="0.5"
+      cy="0.5"
+      r="0.5"
+      fx="0.35"
+      fy="0.35"
+      fr="5%">
+      <stop offset="0%" stop-color="white" />
+      <stop offset="100%" stop-color="darkseagreen" />
+    </radialGradient>
+    <radialGradient
+      id="gradient2"
+      cx="0.5"
+      cy="0.5"
+      r="0.5"
+      fx="0.35"
+      fy="0.75"
+      fr="5%">
+      <stop offset="0%" stop-color="white" />
+      <stop offset="100%" stop-color="darkseagreen" />
+    </radialGradient>
   </defs>
 
-  <rect x="10" y="10" rx="15" ry="15" width="100" height="100"
-        fill="url(#Gradient)" stroke="black" stroke-width="2"/>
+  <circle cx="100" cy="100" r="100" fill="url(#gradient1)" />
+  <circle
+    cx="100"
+    cy="100"
+    r="100"
+    fill="url(#gradient2)"
+    style="transform: translateX(240px);" />
+</svg>
+```
+
+{{EmbedLiveSample("示例 1", "480", "200")}}
 
-  <circle cx="60" cy="60" r="50" fill="transparent" stroke="white" stroke-width="2"/>
-  <circle cx="35" cy="35" r="2" fill="white" stroke="white"/>
-  <circle cx="60" cy="60" r="2" fill="white" stroke="white"/>
-  <text x="38" y="40" fill="white" font-family="sans-serif" font-size="10pt">(fx,fy)</text>
-  <text x="63" y="63" fill="white" font-family="sans-serif" font-size="10pt">(cx,cy)</text>
+### 示例 2
 
+```html
+<svg
+  viewBox="0 0 120 120"
+  width="200"
+  height="200"
+  xmlns="http://www.w3.org/2000/svg">
+  <defs>
+    <radialGradient
+      id="Gradient"
+      cx="0.5"
+      cy="0.5"
+      r="0.5"
+      fx="0.35"
+      fy="0.35"
+      fr="5%">
+      <stop offset="0%" stop-color="red" />
+      <stop offset="100%" stop-color="blue" />
+    </radialGradient>
+  </defs>
+
+  <rect
+    x="10"
+    y="10"
+    rx="15"
+    ry="15"
+    width="100"
+    height="100"
+    fill="url(#Gradient)"
+    stroke="black"
+    stroke-width="2" />
+
+  <circle
+    cx="60"
+    cy="60"
+    r="50"
+    fill="transparent"
+    stroke="white"
+    stroke-width="2" />
+  <circle cx="35" cy="35" r="2" fill="white" stroke="white" />
+  <circle cx="60" cy="60" r="2" fill="white" stroke="white" />
+  <text x="38" y="40" fill="white" font-family="sans-serif" font-size="10pt">
+    (fx,fy)
+  </text>
+  <text x="63" y="63" fill="white" font-family="sans-serif" font-size="10pt">
+    (cx,cy)
+  </text>
 </svg>
 ```
 
-## 元素
+{{EmbedLiveSample("示例 2", "200", "250")}}
 
-下列元素可以使用 `fy` 属性：
+## 用法
 
-- {{ SVGElement("radialGradient") }}
+<table class="properties">
+  <tbody>
+    <tr>
+      <th scope="row">值</th>
+      <td>{{cssxref("length")}}</td>
+    </tr>
+    <tr>
+      <th scope="row">默认值</th>
+      <td>
+        与元素的 {{SVGAttr("cy")}} 表现值一致，不论
+        <code>cy</code> 的值是继承与否。
+      </td>
+    </tr>
+    <tr>
+      <th scope="row">可变性</th>
+      <td>否</td>
+    </tr>
+  </tbody>
+</table>
 
 ## 规范
 
 {{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}
diff --git a/files/zh-cn/web/svg/attribute/height/index.md b/files/zh-cn/web/svg/attribute/height/index.md
@@ -3,20 +3,11 @@ title: height
 slug: Web/SVG/Attribute/height
 ---
 
-« [SVG 属性参考主页](/zh-CN/SVG/Attribute)
+{{SVGRef}}
 
 该属性在用户坐标系统中标识了一个垂直长度。该坐标的确切效果依赖于每个元素。大多数时候，它体现引用元素的矩形区域的高度（请阅读每个元素的文档以了解例外情况）。
 
-除了{{ SVGElement("svg") }}元素之外，别的元素都必须指定该属性，{{ SVGElement("svg") }}的高度默认是**100%**，而{{ SVGElement("filter") }}元素以及{{ SVGElement("mask") }}元素的默认高度是**120%**。
-
-## 用法
-
-| 类别   | 无                                      |
-| ------ | --------------------------------------- |
-| 值     | [\<length>](/zh-CN/SVG/Content_type#Length) |
-| 可变性 | Yes                                     |
-
-{{ page("/zh-CN/Content_type","Length") }}
+除了{{ SVGElement("svg") }}元素之外，别的元素都必须指定该属性，{{ SVGElement("svg") }}的高度默认是 **100%**，而 {{ SVGElement("filter") }} 元素以及 {{ SVGElement("mask") }} 元素的默认高度是 **120%**。
 
 ## 示例
 
@@ -44,6 +35,38 @@ slug: Web/SVG/Attribute/height
 - {{ SVGElement("use") }}
 - {{ SVGElement("mask") }}
 
+## 用法
+
+对于 {{SVGElement('use')}} 元素，`height` 定义了引用元素的垂直长度。
+
+<table class="properties">
+  <tbody>
+    <tr>
+      <th scope="row">值</th>
+      <td>
+        <code>auto</code> |
+        <strong
+          ><a href="/docs/Web/SVG/Content_type#Length">&#x3C;length></a></strong
+        >
+        |
+        <strong
+          ><a href="/docs/Web/SVG/Content_type#Percentage"
+            >&#x3C;percentage></a
+          ></strong
+        >
+      </td>
+    </tr>
+    <tr>
+      <th scope="row">默认值</th>
+      <td><code>auto</code>（视为 <code>0</code>）</td>
+    </tr>
+    <tr>
+      <th scope="row">可变性</th>
+      <td>是</td>
+    </tr>
+  </tbody>
+</table>
+
 ## 规范
 
 {{Specifications}}
diff --git a/files/zh-cn/web/svg/attribute/repeatcount/index.md b/files/zh-cn/web/svg/attribute/repeatcount/index.md
@@ -3,29 +3,46 @@ title: repeatCount
 slug: Web/SVG/Attribute/repeatCount
 ---
 
-« [SVG 属性参考](/zh-CN/SVG/Attribute)
+{{SVGRef}}
 
 这个属性表示动画将发生的次数。
 
 这个属性的值指定了重复的次数。它也可以包括用分数值表示。它的值必须大于 0。
 
-## 用法解释
-
-| 类别       | 动画时间属性                                            |
-| ---------- | ------------------------------------------------------- |
-| Value      | [\<number>](/zh-CN/SVG/Content_type#Number) \| "indefinite" |
-| Animatable | No                                                      |
-
-{{ page("/en/SVG/Content_type","Number") }}
-
-## Example
-
-## Elements
+## 示例
 
 The following elements can use the `repeatCount` attribute
 
 - [Animation elements](/zh-CN/SVG/Element#Animation) »
 
+## 用法
+
+<table class="properties">
+  <tbody>
+    <tr>
+      <th scope="row">值</th>
+      <td>{{cssxref("number")}} | <code>indefinite</code></td>
+    </tr>
+    <tr>
+      <th scope="row">默认值</th>
+      <td><em>无</em></td>
+    </tr>
+    <tr>
+      <th scope="row">可变性</th>
+      <td>否</td>
+    </tr>
+  </tbody>
+</table>
+
+- `<number>`
+  - : 该值指定迭代次数。它可以使用分数值来表示部分迭代。分数值仅表示整个动画持续时间的一部分。值必须大于 `0`。
+- `indefinite`
+  - : 该值表示动画将无限期地重复（即直到文档结束）。
+
 ## 规范
 
 {{Specifications}}
+
+## 浏览器兼容性
+
+{{Compat}}