chore(zh-cn): add language tags for fenced codes (part 4) (#23300)

files/zh-cn/.markdownlint.jsonc

@@ -3,6 +3,7 @@
   "no-trailing-punctuation": {
     "punctuation": ".,;:。，",
   },
+  "fenced-code-language": true,
   "search-replace": {
     "rules": [
       {
@@ -73,6 +74,26 @@
         "searchPattern": "/您/g",
         "searchScope": "text",
       },
+      {
+        "name": "text-code-fence",
+        "message": "Use 'plain' tag",
+        "searchPattern": "/(^ *`{3,})(text|none|unix)/gm",
+        "replace": "$1plain",
+        "searchScope": "text",
+      },
+      {
+        "name": "gfm-alert",
+        "message": "Use the GFM syntax: https://developer.mozilla.org/zh-CN/docs/MDN/Writing_guidelines/Howto/Markdown_in_MDN#备注、警告和标注",
+        "searchPattern": "/^ *> \\*\\*(Note|Warning|Callout):\\*\\*(?! [[{`_*])/gm",
+        "searchScope": "text",
+      },
+      {
+        "name": "bad-gfm-alert",
+        "message": "Use the correct GFM syntax: `> [!NOTE]`",
+        // TODO this should use the modifier syntax; until it has better Node support
+        "searchPattern": "/^ *> !?\\[!?((?!NOTE)[Nn][Oo][Tt][Ee]|(?!WARNING)[Ww][Aa][Rr][Nn][Ii][Nn][Gg]|(?!CALLOUT)[Cc][Aa][Ll][Ll][Oo][Uu][Tt])\\]\\n|^ *> (?!\\[!)!?\\[!?(NOTE|WARNING|CALLOUT)\\]\\n/gm",
+        "searchScope": "text",
+      },
     ],
   },
 }

files/zh-cn/web/api/mediaquerylist/index.md

@@ -9,13 +9,6 @@ slug: Web/API/MediaQueryList
 
 如果你需要以编程方式来检测一个 document 上的媒体查询的值的变化，这个 `MediaQueryList` 对象使得通过观察其 document 而检测它的媒体查询的值的变化成为可能，而不是周期性地对这些媒体查询的值进行检查。
 
-## 方法概述
-
-```
-void addListener(MediaQueryListListener listener);
-void removeListener(MediaQueryListListener listener);
-```
-
 ## 实例属性
 
 _`MediaQueryList` 接口从它的父接口 {{DOMxRef("EventTarget")}} 继承了属性。_
@@ -31,12 +24,6 @@ _`MediaQueryList` 接口从它的父接口 {{DOMxRef("EventTarget")}} 继承了
 
 在媒体查询列表上增加一个新的监听器，如果列表中已经存在了这个指定的监听器，这个方法将失去作用。
 
-```
-void addListener(
-  MediaQueryListListener listener
-);
-```
-
 #### 参数 ( 针对 addListener 方法)
 
 - `listener`
@@ -46,12 +33,6 @@ void addListener(
 
 从媒体查询列表中移除一个监听器，如果列表中不存在这个指定的监听器，则这个方法将失去作用。
 
-```
-void removeListener(
-  MediaQueryListListener listener
-);
-```
-
 #### 参数 (针对 removeListener 方法)
 
 - `listener`

files/zh-cn/web/api/node/index.md

@@ -182,12 +182,6 @@ function eachNode(rootNode, callback) {
 }
 ```
 
-#### 语法
-
-```
-eachNode(rootNode, callback);
-```
-
 #### 描述
 
 使用递归的方式对 `rootNode` 的所有后代节点执行回调函数（包括 `rootNode` 自身）

files/zh-cn/web/api/uievent/which/index.md

@@ -7,13 +7,7 @@ slug: Web/API/UIEvent/which
 
 {{domxref("KeyboardEvent")}} 接口的 **`which`** 只读属性返回所按下键的数字 `keyCode` 或所按下字母数字键的字符代码 (`charCode`) 。
 
-## 语法
-
-```
-var keyResult = event.which;
-```
-
-### 返回值
+## 值
 
 - `keyResult` contains the numeric code for a particular key pressed, depending on whether an alphanumeric or non-alphanumeric key was pressed. Please see {{domxref("KeyboardEvent.charCode")}} and {{domxref("KeyboardEvent.keyCode")}} for more details.
 

files/zh-cn/web/css/-webkit-touch-callout/index.md

@@ -13,16 +13,16 @@ slug: Web/CSS/-webkit-touch-callout
 
 ## 语法
 
-```
-Formal syntax: default | none
-```
-
 ```css
--webkit-touch-callout: default; /* displays the callout */
--webkit-touch-callout: none; /* disables the callout */
+/* 关键字值 */
+-webkit-touch-callout: default;
+-webkit-touch-callout: none;
 
+/* 全局值 */
 -webkit-touch-callout: initial;
 -webkit-touch-callout: inherit;
+-webkit-touch-callout: revert;
+-webkit-touch-callout: revert-layer;
 -webkit-touch-callout: unset;
 ```
 

files/zh-cn/web/css/_colon_target/index.md

@@ -16,7 +16,7 @@ slug: Web/CSS/:target
 
 例如，以下 URL 具有一个片段（由 # 符号表示），指向名为 `section2` 的元素：
 
-```
+```url
 http://www.example.com/index.html#section2
 ```
 

files/zh-cn/web/css/_colon_where/index.md

@@ -26,6 +26,14 @@ footer p:hover {
 
 `:where()` 和 {{CSSxRef(":is", ":is()")}} 的不同之处在于，`:where()` 的[优先级](/zh-CN/docs/Web/CSS/Specificity)总是为 0，但是 `:is()` 的优先级是由它的选择器列表中优先级最高的[选择器](/zh-CN/docs/Glossary/CSS_Selector)决定的。
 
+## 语法
+
+```css-nolint
+:where(<complex-selector-list>) {
+  /* ... */
+}
+```
+
 ### 可容错选择器解析
 
 规范将 `:is()` 和 `:where()` 定义为接受一个[可容错选择器列表](https://drafts.csswg.org/selectors-4/#typedef-forgiving-selector-list)。
@@ -143,12 +151,6 @@ footer a {
 
 {{EmbedLiveSample('示例', '100%', 600)}}
 
-## 语法
-
-```
-:where( <complex-selector-list> )
-```
-
 ## 规范
 
 {{Specifications}}

files/zh-cn/web/css/_doublecolon_backdrop/index.md

@@ -20,8 +20,10 @@ dialog::backdrop {
 
 ## 语法
 
-```
-::backdrop
+```css
+::backdrop {
+  /* ... */
+}
 ```
 
 ## 示例

files/zh-cn/web/css/_doublecolon_cue/index.md

@@ -26,8 +26,10 @@ slug: Web/CSS/::cue
 
 ## 语法
 
-```
-::cue | ::cue( <selector> )
+```css-nolint
+::cue | ::cue(<selector>) {
+  /* ... */
+}
 ```
 
 ## 示例

files/zh-cn/web/css/_doublecolon_selection/index.md

@@ -31,11 +31,10 @@ slug: Web/CSS/::selection
 
 ## 语法
 
-```
-/* Legacy Firefox syntax (version 61 and below) */
-::-moz-selection
-
-{{CSSSyntax}}
+```css
+::selection {
+  /* ... */
+}
 ```
 
 ## 示例

files/zh-cn/web/css/attr/index.md

@@ -17,8 +17,17 @@ CSS 表达式 `attr()` 用来获取选择到的元素的某一 HTML 属性值，
 
 ## 语法
 
-```
-语法：attr( attribute-name <type-or-unit>? [, <fallback> ]? )
+```css
+/* 关键字值 */
+-webkit-touch-callout: default;
+-webkit-touch-callout: none;
+
+/* 全局值 */
+-webkit-touch-callout: initial;
+-webkit-touch-callout: inherit;
+-webkit-touch-callout: revert;
+-webkit-touch-callout: revert-layer;
+-webkit-touch-callout: unset;
 ```
 
 ### 解释

files/zh-cn/web/css/background-blend-mode/index.md

@@ -15,19 +15,18 @@ slug: Web/CSS/background-blend-mode
 
 ## 语法
 
-```
-Formal syntax:  {{csssyntax("background-blend-mode")}}
-```
-
-```
+```css
 /* 单值 */
 background-blend-mode: normal;
 
-/* 双值，每个背景一个值 */
+/* 双值，一个值对应一个背景 */
 background-blend-mode: darken, luminosity;
 
-background-blend-mode: initial;
+/* 全局值 */
 background-blend-mode: inherit;
+background-blend-mode: initial;
+background-blend-mode: revert;
+background-blend-mode: revert-layer;
 background-blend-mode: unset;
 ```
 
@@ -36,6 +35,14 @@ background-blend-mode: unset;
 - {{cssxref("<blend-mode>")}}
   - : 一个定义混合的模式，可以有多个值，用逗号间隔。
 
+## 形式定义
+
+{{cssinfo}}
+
+## 形式语法
+
+{{csssyntax}}
+
 ## 示例
 
 ```html hidden

files/zh-cn/web/css/background-origin/index.md

@@ -14,20 +14,20 @@ slug: Web/CSS/background-origin
 > [!NOTE]
 > 假如{{cssxref("background")}}简写中没有设置该值，那么在 background 简写值后指定 background-origin，那么后面的值就会覆盖简写值，其实说白了，就是后出现的值会覆盖前面的值。
 
-{{cssinfo}}
-
 ## 语法
 
-```
-Formal syntax: {{csssyntax("background-origin")}}
-```
-
-```
-background-origin: border-box
-background-origin: padding-box
-background-origin: content-box
-
-background-origin: inherit
+```css
+/* 关键字值 */
+background-origin: border-box;
+background-origin: padding-box;
+background-origin: content-box;
+
+/* 全局值 */
+background-origin: inherit;
+background-origin: initial;
+background-origin: revert;
+background-origin: revert-layer;
+background-origin: unset;
 ```
 
 ### 属性值
@@ -39,12 +39,15 @@ background-origin: inherit
 - `content-box`
   - : 背景图片的摆放以 content 区域为参考
 
-### 形式化语法
+## 形式语法
+
+{{cssinfo}}
+
+## 形式定义
 
-[How to read CSS syntax.](/zh-CN/docs/Web/CSS/Value_definition_syntax)
-{{csssyntax("background-origin")}}
+{{csssyntax}}
 
-## 例子
+## 示例
 
 ```css
 .example {

files/zh-cn/web/css/background-position/index.md

@@ -84,20 +84,20 @@ background-position: unset;
 
 基本上发生的情况是从相应的容器尺寸中*减去*背景图像尺寸，然后将结果值的百分比用作从左（或顶部）边界的直接偏移量。
 
-```
+```plain
 (container width - image width) * (position x%) = (x offset value)
 (container height - image height) * (position y%) = (y offset value)
 ```
 
 以 X 轴为例，假设我们有一个 300px 宽的图像，我们在一个 100px 宽的容器中使用它，`background-size` 设置为 `auto`：
 
-```
+```plain
 100px - 300px = -200px (container & image difference)
 ```
 
 因此，位置百分比为 -25%、0%、50%、100%、125%，我们得到这些图像到容器边界偏移值：
 
-```
+```plain
 -200px * -25% = 50px
 -200px * 0% = 0px
 -200px * 50% = -100px