diff options
Diffstat (limited to 'files/zh-cn/web/css')
31 files changed, 107 insertions, 107 deletions
diff --git a/files/zh-cn/web/css/@keyframes/index.html b/files/zh-cn/web/css/@keyframes/index.html index f506ec158d..e420e7226e 100644 --- a/files/zh-cn/web/css/@keyframes/index.html +++ b/files/zh-cn/web/css/@keyframes/index.html @@ -9,7 +9,7 @@ translation_of: Web/CSS/@keyframes --- <div>{{CSSRef}}</div> -<p><span class="seoSummary">关键帧 <strong><code>@keyframes</code></strong> <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/At-rule">at-rule</a> 规则通过在动画序列中定义关键帧（或waypoints）的样式来控制CSS动画序列中的中间步骤。</span>和 <a href="/zh-CN/docs/Web/CSS/CSS_Transitions">转换 transition</a> 相比，关键帧 keyframes 可以控制动画序列的中间步骤。</p> +<p><span class="seoSummary">关键帧 <strong><code>@keyframes</code></strong> <a href="/zh-CN/docs/Web/CSS/At-rule">at-rule</a> 规则通过在动画序列中定义关键帧（或waypoints）的样式来控制CSS动画序列中的中间步骤。</span>和 <a href="/zh-CN/docs/Web/CSS/CSS_Transitions">转换 transition</a> 相比，关键帧 keyframes 可以控制动画序列的中间步骤。</p> <pre class="brush: css no-line-numbers notranslate"><code>@keyframes slidein { from { diff --git a/files/zh-cn/web/css/_colon_is/index.html b/files/zh-cn/web/css/_colon_is/index.html index 2f0a3d04de..5b1d68e355 100644 --- a/files/zh-cn/web/css/_colon_is/index.html +++ b/files/zh-cn/web/css/_colon_is/index.html @@ -210,7 +210,7 @@ h1 { <h3 id="Avoiding_selector_list_invalidation">Avoiding selector list invalidation</h3> -<p>Unlike <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Selector_list">selector lists</a>, the <code>:is()</code> pseudo-class doesn't get invalidated when one of the selectors passed to it isn't supported by the browser.</p> +<p>Unlike <a href="/zh-CN/docs/Web/CSS/Selector_list">selector lists</a>, the <code>:is()</code> pseudo-class doesn't get invalidated when one of the selectors passed to it isn't supported by the browser.</p> <pre><code>:is(:valid, :unsupported) { ... @@ -276,8 +276,8 @@ h1 { <h2 id="相关链接">相关链接</h2> <ul> - <li>{{CSSxRef(":where", ":where()")}} {{Experimental_Inline}} - Like <code>:is()</code>, but with 0 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Specificity">specificity</a>.</li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Selector_list">Selector list</a></li> + <li>{{CSSxRef(":where", ":where()")}} {{Experimental_Inline}} - Like <code>:is()</code>, but with 0 <a href="/zh-CN/docs/Web/CSS/Specificity">specificity</a>.</li> + <li><a href="/zh-CN/docs/Web/CSS/Selector_list">Selector list</a></li> </ul> <ul> diff --git a/files/zh-cn/web/css/_colon_required/index.html b/files/zh-cn/web/css/_colon_required/index.html index c051cf0b14..1374ca2753 100644 --- a/files/zh-cn/web/css/_colon_required/index.html +++ b/files/zh-cn/web/css/_colon_required/index.html @@ -7,7 +7,7 @@ translation_of: 'Web/CSS/:required' <h2 id="摘要">摘要</h2> -<p><code>:required</code> <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS">CSS</a> <a href="/en/CSS/Pseudo-classes" title="Pseudo-classes">伪类</a> 表示任意设置了{{ htmlattrxref("required", "input") }}属性的{{ HTMLElement("input") }}，{{HTMLElement("select")}}, 或 {{HTMLElement("textarea")}}元素。 这个伪类对于高亮显示在提交表单之前必须具有有效数据的字段非常有用。</p> +<p><code>:required</code> <a href="/zh-CN/docs/Web/CSS">CSS</a> <a href="/en/CSS/Pseudo-classes" title="Pseudo-classes">伪类</a> 表示任意设置了{{ htmlattrxref("required", "input") }}属性的{{ HTMLElement("input") }}，{{HTMLElement("select")}}, 或 {{HTMLElement("textarea")}}元素。 这个伪类对于高亮显示在提交表单之前必须具有有效数据的字段非常有用。</p> <p>注意：{{ cssxref(":optional") }}伪类选中'可选的'表单字段。</p> diff --git a/files/zh-cn/web/css/alternative_style_sheets/index.html b/files/zh-cn/web/css/alternative_style_sheets/index.html index 1d5d3c0cd7..6e6f639b88 100644 --- a/files/zh-cn/web/css/alternative_style_sheets/index.html +++ b/files/zh-cn/web/css/alternative_style_sheets/index.html @@ -42,7 +42,7 @@ translation_of: Web/CSS/Alternative_style_sheets <p><a href="/samples/cssref/altstyles/index.html">Click here</a> for a working example you can try out.</p> -<p><a href="https://wiki.developer.mozilla.org/samples/cssref/altstyles/index.html">点击此处</a>进入示例。</p> +<p><a href="https://mdn.github.io/css-examples/alt-style-sheets/">点击此处</a>进入示例。</p> <h2 id="细节">细节</h2> diff --git a/files/zh-cn/web/css/border-bottom-left-radius/index.html b/files/zh-cn/web/css/border-bottom-left-radius/index.html index bc59f965fb..c1982c205c 100644 --- a/files/zh-cn/web/css/border-bottom-left-radius/index.html +++ b/files/zh-cn/web/css/border-bottom-left-radius/index.html @@ -15,7 +15,7 @@ translation_of: Web/CSS/border-bottom-left-radius <p>一个无论是图像或颜色的背景，都会在边框上被裁剪，即使背景是圆角的; 裁剪的确切位置由 {{cssxref("background-clip")}} 属性定义.</p> -<div class="note">如果该属性的值没有被一个在<strong><code>border-bottom-left-radius</code></strong> 属性后，作用于当前元素上的{{cssxref("border-radius")}}简写属性设置，那么该属性值将会被<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Shorthand_properties">shorthand property</a>重置为初始值。</div> +<div class="note">如果该属性的值没有被一个在<strong><code>border-bottom-left-radius</code></strong> 属性后，作用于当前元素上的{{cssxref("border-radius")}}简写属性设置，那么该属性值将会被<a href="/zh-CN/docs/Web/CSS/Shorthand_properties">shorthand property</a>重置为初始值。</div> <p>{{cssinfo}}</p> diff --git a/files/zh-cn/web/css/box-shadow/index.html b/files/zh-cn/web/css/box-shadow/index.html index b01af9d276..0ef19a4f06 100644 --- a/files/zh-cn/web/css/box-shadow/index.html +++ b/files/zh-cn/web/css/box-shadow/index.html @@ -49,7 +49,7 @@ box-shadow: unset; <p>向元素添加单个 box-shadow 效果时使用以下规则：</p> <ul> - <li>当给出两个、三个或四个 <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/length"><length></a></code>值时。 + <li>当给出两个、三个或四个 <code><a href="/zh-CN/docs/Web/CSS/length"><length></a></code>值时。 <ul> <li>如果只给出两个值, 那么这两个值将会被当作 <code><a href="#offset-x"><offset-x><offset-y></a></code> 来解释。</li> diff --git a/files/zh-cn/web/css/clip-path/index.html b/files/zh-cn/web/css/clip-path/index.html index 8b371b1ad6..4ce0104d60 100644 --- a/files/zh-cn/web/css/clip-path/index.html +++ b/files/zh-cn/web/css/clip-path/index.html @@ -86,7 +86,7 @@ clip-path: unset; </dl> <div class="blockIndicator note"> -<p><strong>Note</strong>: A computed value other than <strong><code>none</code></strong> results in the creation of a new <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/Understanding_z-index/The_stacking_context">stacking context</a> the same way that CSS {{cssxref("opacity")}} does for values other than <code>1</code>.</p> +<p><strong>Note</strong>: A computed value other than <strong><code>none</code></strong> results in the creation of a new <a href="/zh-CN/docs/CSS/Understanding_z-index/The_stacking_context">stacking context</a> the same way that CSS {{cssxref("opacity")}} does for values other than <code>1</code>.</p> </div> <h3 id="正式语法">正式语法</h3> diff --git a/files/zh-cn/web/css/color/index.html b/files/zh-cn/web/css/color/index.html index 622c2294cf..48f4c47340 100644 --- a/files/zh-cn/web/css/color/index.html +++ b/files/zh-cn/web/css/color/index.html @@ -75,7 +75,7 @@ color: unset;</pre> <p>It is important to ensure that the contrast ratio between the color of the text and the background the text is placed over is high enough that people experiencing low vision conditions will be able to read the content of the page.</p> -<p>Color contrast ratio is determined by comparing the luminosity of the text and background color values. In order to meet current <a href="https://www.w3.org/WAI/intro/wcag">Web Content Accessibility Guidelines (WCAG)</a>, a ratio of 4.5:1 is required for text content and 3:1 for larger text such as headings. Large text is defined as 18.66px and <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/font-weight">bold</a> or larger, or 24px or larger.</p> +<p>Color contrast ratio is determined by comparing the luminosity of the text and background color values. In order to meet current <a href="https://www.w3.org/WAI/intro/wcag">Web Content Accessibility Guidelines (WCAG)</a>, a ratio of 4.5:1 is required for text content and 3:1 for larger text such as headings. Large text is defined as 18.66px and <a href="/zh-CN/docs/Web/CSS/font-weight">bold</a> or larger, or 24px or larger.</p> <ul> <li><a href="https://webaim.org/resources/contrastchecker/">WebAIM: Color Contrast Checker</a></li> @@ -155,5 +155,5 @@ p { color: hsla(0, 100%, 50%, 0.5); }</pre> <ul> <li>颜色 {{cssxref("<color>")}} 数据类型</li> <li>其他颜色相关属性：{{cssxref("background-color")}}、{{cssxref("border-color")}}、{{cssxref("outline-color")}}、{{cssxref("text-decoration-color")}}、{{cssxref("text-emphasis-color")}}、{{cssxref("text-shadow")}}、{{cssxref("caret-color")}}、{{cssxref("column-rule-color")}}和{{cssxref("color-adjust")}}</li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/HTML/Applying_color">使用CSS对HTML元素应用颜色</a></li> + <li><a href="/zh-CN/docs/Web/HTML/Applying_color">使用CSS对HTML元素应用颜色</a></li> </ul> diff --git a/files/zh-cn/web/css/color_value/index.html b/files/zh-cn/web/css/color_value/index.html index c882e269af..e54bc2b58a 100644 --- a/files/zh-cn/web/css/color_value/index.html +++ b/files/zh-cn/web/css/color_value/index.html @@ -29,7 +29,7 @@ translation_of: Web/CSS/color_value </ul> <div class="blockIndicator note"> -<p><strong>注意：</strong>本文章详细描述了<code><color></code>数据类型。如要了解更多关于在HTML中使用颜色的信息，请参阅<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/HTML/Applying_color">使用CSS为HTML元素应用颜色</a>。</p> +<p><strong>注意：</strong>本文章详细描述了<code><color></code>数据类型。如要了解更多关于在HTML中使用颜色的信息，请参阅<a href="/zh-CN/docs/Web/HTML/Applying_color">使用CSS为HTML元素应用颜色</a>。</p> </div> <h2 id="语法">语法</h2> @@ -1051,7 +1051,7 @@ translation_of: Web/CSS/color_value <h3 id="系统颜色">系统颜色</h3> -<p>In <em>forced colors mode</em> (detectable with the <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/@media/forced-colors">forced-colors</a> media query), most colors are restricted into a user- and browser-defined palette. These system colors are exposed by the following keywords, which can be used to ensure that the rest of the page integrates well with the restricted palette. These values may also be used in other contexts, but are not widely supported by browsers. </p> +<p>In <em>forced colors mode</em> (detectable with the <a href="/zh-CN/docs/Web/CSS/@media/forced-colors">forced-colors</a> media query), most colors are restricted into a user- and browser-defined palette. These system colors are exposed by the following keywords, which can be used to ensure that the rest of the page integrates well with the restricted palette. These values may also be used in other contexts, but are not widely supported by browsers. </p> <p>The keywords in the following list are defined by the CSS Color Module Level 4 specification.</p> @@ -1366,7 +1366,7 @@ translation_of: Web/CSS/color_value <h2 id="Accessibility_considerations">Accessibility considerations</h2> -<p>Some people have difficulty distinguishing colors. The <a class="external external-icon" href="https://www.w3.org/TR/WCAG/#visual-audio-contrast">WCAG 2.0</a> recommendation strongly advises against using color as the only means of conveying a specific message, action, or result. See <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a> for more information.</p> +<p>Some people have difficulty distinguishing colors. The <a class="external external-icon" href="https://www.w3.org/TR/WCAG/#visual-audio-contrast">WCAG 2.0</a> recommendation strongly advises against using color as the only means of conveying a specific message, action, or result. See <a href="/zh-CN/docs/Learn/Accessibility/CSS_and_JavaScript#Color_and_color_contrast">Color and color contrast</a> for more information.</p> <h2 id="示例">示例</h2> diff --git a/files/zh-cn/web/css/counter()/index.html b/files/zh-cn/web/css/counter()/index.html index d45b73b366..e8cfc3ce91 100644 --- a/files/zh-cn/web/css/counter()/index.html +++ b/files/zh-cn/web/css/counter()/index.html @@ -38,13 +38,13 @@ counter(countername, upper-roman)</pre> <h3 id="正式语法">正式语法</h3> -<pre class="syntaxbox notranslate">counter( <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a>, <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/counter#counter-style"><counter-style></a><a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/Value_definition_syntax#Question_mark_()" title="Question mark: the entity is optional">?</a> ) +<pre class="syntaxbox notranslate">counter( <a href="/zh-CN/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a>, <a href="/zh-CN/docs/Web/CSS/counter#counter-style"><counter-style></a><a href="/zh-CN/docs/CSS/Value_definition_syntax#Question_mark_()" title="Question mark: the entity is optional">?</a> ) where -<code><counter-style> = <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/counter#counter-style-name"><counter-style-name></a> <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/Value_definition_syntax#Single_bar" title="Single bar: exactly one of the entities must be present">|</a> symbols()</code> +<code><counter-style> = <a href="/zh-CN/docs/Web/CSS/counter#counter-style-name"><counter-style-name></a> <a href="/zh-CN/docs/CSS/Value_definition_syntax#Single_bar" title="Single bar: exactly one of the entities must be present">|</a> symbols()</code> where -<code><counter-style-name> = <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a></code></pre> +<code><counter-style-name> = <a href="/zh-CN/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a></code></pre> <p><strong>示例</strong></p> diff --git a/files/zh-cn/web/css/counters()/index.html b/files/zh-cn/web/css/counters()/index.html index 0e5c3dd7d3..c758a6a3ad 100644 --- a/files/zh-cn/web/css/counters()/index.html +++ b/files/zh-cn/web/css/counters()/index.html @@ -17,12 +17,12 @@ counters(countername, '-'); /* changing the counter display */ counters(countername, '.', upper-roman)</pre> -<p>一个<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters">计数器</a>本身没有可见的效果，而是通过<code>counter()</code>函数（和<code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/counters">counters()</a></code>函数）返回开发人员定义的字符串（或图像） 从而使计数器拥有很棒的作用。</p> +<p>一个<a href="/zh-CN/docs/Web/CSS/CSS_Lists_and_Counters/Using_CSS_counters">计数器</a>本身没有可见的效果，而是通过<code>counter()</code>函数（和<code><a href="/zh-CN/docs/Web/CSS/counters">counters()</a></code>函数）返回开发人员定义的字符串（或图像） 从而使计数器拥有很棒的作用。</p> <div class="blockIndicator note"> -<p><strong>Note:</strong> <code>counter()</code> 函数可以与任何CSS属性一起使用，但是对<code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/content">"content"</a></code>以外的属性的支持是试验性的，对type-or-unit参数的支持很少。</p> +<p><strong>Note:</strong> <code>counter()</code> 函数可以与任何CSS属性一起使用，但是对<code><a href="/zh-CN/docs/Web/CSS/content">"content"</a></code>以外的属性的支持是试验性的，对type-or-unit参数的支持很少。</p> -<p>在使用此功能之前，请仔细检查<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/counter#Browser_compatibility">浏览器兼容性表</a> 。</p> +<p>在使用此功能之前，请仔细检查<a href="/zh-CN/docs/Web/CSS/counter#Browser_compatibility">浏览器兼容性表</a> 。</p> </div> <h2 id="Syntax">Syntax</h2> @@ -30,24 +30,24 @@ counters(countername, '.', upper-roman)</pre> <h3 id="Values">Values</h3> <dl> - <dt><code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/custom-ident"><custom-ident></a> 自定义标识</code></dt> - <dd>一个标识计数器的名称，区分大小写，并且与<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/counter-reset" title=" - counter-reset 属性用于将 CSS计数器 重置为制定值"><code>counter-reset</code></a>和<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/counter-increment" title="counter-increment属性用于将CSS Counters的值增加给定值。可以使用 counter-reset 属性重置计数器的值。"><code>counter-increment</code></a>中的“名称”相同。名称不能以两个破折号开头，并且不能为<code>none</code>, <code>unset</code>, <code>initial</code>, 或 <code>inherit</code>。</dd> + <dt><code><a href="/zh-CN/docs/Web/CSS/custom-ident"><custom-ident></a> 自定义标识</code></dt> + <dd>一个标识计数器的名称，区分大小写，并且与<a href="/zh-CN/docs/Web/CSS/counter-reset" title=" + counter-reset 属性用于将 CSS计数器 重置为制定值"><code>counter-reset</code></a>和<a href="/zh-CN/docs/Web/CSS/counter-increment" title="counter-increment属性用于将CSS Counters的值增加给定值。可以使用 counter-reset 属性重置计数器的值。"><code>counter-increment</code></a>中的“名称”相同。名称不能以两个破折号开头，并且不能为<code>none</code>, <code>unset</code>, <code>initial</code>, 或 <code>inherit</code>。</dd> <dt><code><counter-style> 计数器样式</code></dt> - <dd>计数器样式名称或 <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/symbols">symbols()</a></code> 函数，其中计数器样式名称是数字，字母或符号的简单预定义计数器样式，复杂的东亚或埃塞俄比亚长手预定义计数器样式，或其他<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Counter_Styles">预定义计数器样式</a>。如果省略，则计数器样式默认为十进制。</dd> + <dd>计数器样式名称或 <code><a href="/zh-CN/docs/Web/CSS/symbols">symbols()</a></code> 函数，其中计数器样式名称是数字，字母或符号的简单预定义计数器样式，复杂的东亚或埃塞俄比亚长手预定义计数器样式，或其他<a href="/zh-CN/docs/Web/CSS/CSS_Counter_Styles">预定义计数器样式</a>。如果省略，则计数器样式默认为十进制。</dd> <dt><code><a href="/en-US/docs/Web/CSS/string"><string></a> 字符串</code></dt> <dd>任意数量的文本字符。非拉丁字符必须使用其Unicode转义序列进行编码：例如，<code>\ 000A9</code>表示版权符号。</dd> </dl> <h3 id="Formal_syntax">Formal syntax</h3> -<pre class="syntaxbox">counters( <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a>, <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/string" title="The <string> CSS data type represents a sequence of characters. Strings are used in numerous CSS properties, such as content, font-family, and quotes."><string></a>, <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/counters#counter-style"><counter-style></a><a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/Value_definition_syntax#Question_mark_()" title="Question mark: the entity is optional">?</a> ) +<pre class="syntaxbox">counters( <a href="/zh-CN/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a>, <a href="/zh-CN/docs/Web/CSS/string" title="The <string> CSS data type represents a sequence of characters. Strings are used in numerous CSS properties, such as content, font-family, and quotes."><string></a>, <a href="/zh-CN/docs/Web/CSS/counters#counter-style"><counter-style></a><a href="/zh-CN/docs/CSS/Value_definition_syntax#Question_mark_()" title="Question mark: the entity is optional">?</a> ) where -<code><counter-style> = <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/counters#counter-style-name"><counter-style-name></a> <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/Value_definition_syntax#Single_bar" title="Single bar: exactly one of the entities must be present">|</a> symbols()</code> +<code><counter-style> = <a href="/zh-CN/docs/Web/CSS/counters#counter-style-name"><counter-style-name></a> <a href="/zh-CN/docs/CSS/Value_definition_syntax#Single_bar" title="Single bar: exactly one of the entities must be present">|</a> symbols()</code> where -<code><counter-style-name> = <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a></code></pre> +<code><counter-style-name> = <a href="/zh-CN/docs/Web/CSS/custom-ident" title="The <custom-ident> CSS data type denotes an arbitrary user-defined string used as an identifier. It is case-sensitive, and certain values are forbidden in various contexts to prevent ambiguity."><custom-ident></a></code></pre> <h2 id="Examples">Examples</h2> diff --git a/files/zh-cn/web/css/css_columns/index.html b/files/zh-cn/web/css/css_columns/index.html index d9492d2552..a2202c8b61 100644 --- a/files/zh-cn/web/css/css_columns/index.html +++ b/files/zh-cn/web/css/css_columns/index.html @@ -22,7 +22,7 @@ translation_of: Web/CSS/CSS_Columns <h2 id="Relationship_to_Fragmentation">Relationship to Fragmentation</h2> -<p>Multiple-column Layout is closely related to <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Pages">Paged Media</a>, in that each column box becomes a fragment, much like a printed page becomes a fragment of an overall document. Therefore the properties now defined in the <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Fragmentation">CSS Fragmentation</a> specification are required in order to control how content breaks between columns. </p> +<p>Multiple-column Layout is closely related to <a href="/zh-CN/docs/Web/CSS/CSS_Pages">Paged Media</a>, in that each column box becomes a fragment, much like a printed page becomes a fragment of an overall document. Therefore the properties now defined in the <a href="/zh-CN/docs/Web/CSS/CSS_Fragmentation">CSS Fragmentation</a> specification are required in order to control how content breaks between columns. </p> <h2 id="参考">参考</h2> @@ -58,13 +58,13 @@ translation_of: Web/CSS/CSS_Columns <dl> <dt><a href="/zh-CN/docs/Web/CSS/CSS_Columns/Basic_Concepts_of_Multicol">多列的基本概念</a></dt> <dd>多列布局的概述</dd> - <dt><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Columns/Styling_Columns">设置列的样式</a></dt> + <dt><a href="/zh-CN/docs/Web/CSS/CSS_Columns/Styling_Columns">设置列的样式</a></dt> <dd>如何使用列的分隔线，以及设置列间距。</dd> - <dt><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Columns/Spanning_Columns">Spanning and Balancing</a></dt> + <dt><a href="/zh-CN/docs/Web/CSS/CSS_Columns/Spanning_Columns">Spanning and Balancing</a></dt> <dd>How to make elements span across all columns and controlling the way columns are filled.</dd> - <dt><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Columns/Handling_Overflow_in_Multicol">Handling Overflow in Multicol</a></dt> + <dt><a href="/zh-CN/docs/Web/CSS/CSS_Columns/Handling_Overflow_in_Multicol">Handling Overflow in Multicol</a></dt> <dd>What happens when an item overflows the column it is in and what happens when there is too much columned content to fit a container.</dd> - <dt><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Columns/Handling_content_breaks_in_multicol">Content Breaks in Multicol</a></dt> + <dt><a href="/zh-CN/docs/Web/CSS/CSS_Columns/Handling_content_breaks_in_multicol">Content Breaks in Multicol</a></dt> <dd>Introduction to the Fragmentation specification and how to control where column content breaks.</dd> </dl> diff --git a/files/zh-cn/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html b/files/zh-cn/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html index 29720e70e6..90874a4ae7 100644 --- a/files/zh-cn/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html +++ b/files/zh-cn/web/css/css_flexible_box_layout/aligning_items_in_a_flex_container/index.html @@ -201,14 +201,14 @@ translation_of: Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Contain <p>在本文的开头，我解释了Level1 flexbox 规范中当前包含的对齐相关属性也被包含在了Box Alignment Level3规范中，这意味着将来会很好地扩展这些属性和值。 我们已经看到了这种情况的发生, 比如：为 <code>align-content</code> 和<code>justify-content</code> 属性引入<code>space-evenly</code>值。</p> -<p>Box Alignment 模块还包含其他创建子项之间间隙的方法，比如在 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a> 中包含的 <code>column-gap</code> 和<code>row-gap</code> 特性 。 这些属性包含在Box Alignment规范中意味着在将来我们也应该能够在flex布局中使用<code>column-gap</code>和<code>row-gap</code>，在Firefox 63中，您将在flex布局中找到第一个浏览器对gap属性的实现。</p> +<p>Box Alignment 模块还包含其他创建子项之间间隙的方法，比如在 <a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout">CSS Grid Layout</a> 中包含的 <code>column-gap</code> 和<code>row-gap</code> 特性 。 这些属性包含在Box Alignment规范中意味着在将来我们也应该能够在flex布局中使用<code>column-gap</code>和<code>row-gap</code>，在Firefox 63中，您将在flex布局中找到第一个浏览器对gap属性的实现。</p> -<p>在深入研究flexbox对齐时，我的建议是同时查看Grid Layout中的对齐方式。 两种规范都使用Box Alignment规范中详细说明的对齐属性。您可以在MDN文章《<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box Alignment in Grid Layout</a>》中查看使用网格时这些属性的行为，并且我还在《 <a href="https://rachelandrew.co.uk/css/cheatsheets/box-alignment">Box Alignment Cheatsheet</a>》中比较了这些规范中对齐的工作方式。</p> +<p>在深入研究flexbox对齐时，我的建议是同时查看Grid Layout中的对齐方式。 两种规范都使用Box Alignment规范中详细说明的对齐属性。您可以在MDN文章《<a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box Alignment in Grid Layout</a>》中查看使用网格时这些属性的行为，并且我还在《 <a href="https://rachelandrew.co.uk/css/cheatsheets/box-alignment">Box Alignment Cheatsheet</a>》中比较了这些规范中对齐的工作方式。</p> <h2 id="更多">更多</h2> <ul> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Alignment">Box Alignment</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox">Box Alignment in Flexbox</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Box_Alignment/Box_Alignment_In_Grid_Layout">Box Alignment in Grid Layout</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Box_Alignment">Box Alignment</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Box_Alignment/Box_Alignment_in_Flexbox">Box Alignment in Flexbox</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Box_Alignment/Box_Alignment_In_Grid_Layout">Box Alignment in Grid Layout</a></li> </ul> diff --git a/files/zh-cn/web/css/css_selectors/index.html b/files/zh-cn/web/css/css_selectors/index.html index 33963cb0d6..eb84561833 100644 --- a/files/zh-cn/web/css/css_selectors/index.html +++ b/files/zh-cn/web/css/css_selectors/index.html @@ -24,23 +24,23 @@ translation_of: Web/CSS/CSS_Selectors <h2 id="基本选择器">基本选择器</h2> <dl> - <dt><a href="/zh-CN/docs/Web/CSS/Universal_selectors">通用选择器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Universal_selectors">Universal selector</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Universal_selectors">通用选择器</a>（<a href="/zh-CN/docs/Web/CSS/Universal_selectors">Universal selector</a>）</dt> <dd>选择所有元素。（可选）可以将其限制为特定的名称空间或所有名称空间。<br> <strong>语法：</strong><code>*</code> <code><var>ns</var>|*</code> <code>*|*</code><br> <strong>例子：</strong><code>*</code> 将匹配文档的所有元素。</dd> - <dt><a href="/zh-CN/docs/Web/CSS/Type_selectors">元素选择器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Type_selectors">Type selector</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Type_selectors">元素选择器</a>（<a href="/zh-CN/docs/Web/CSS/Type_selectors">Type selector</a>）</dt> <dd>按照给定的节点名称，选择所有匹配的元素。<br> <strong>语法：</strong><code><var>elementname</var></code><br> <strong>例子：</strong><code>input</code> 匹配任何 {{HTMLElement( "input" )}} 元素。</dd> - <dt><a href="/zh-CN/docs/Web/CSS/Class_selectors">类选择器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors">Class selector</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Class_selectors">类选择器</a>（<a href="/zh-CN/docs/Web/CSS/Class_selectors">Class selector</a>）</dt> <dd>按照给定的 <code>class</code> 属性的值，选择所有匹配的元素。<br> <strong>语法</strong>：<code>.<var>classname</var></code><br> <strong>例子</strong>：<code>.index</code> 匹配任何 <code>class</code> 属性中含有 "index" 类的元素。</dd> - <dt><a href="/zh-CN/docs/Web/CSS/ID_selectors">ID 选择器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/ID_selectors">ID selector</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/ID_selectors">ID 选择器</a>（<a href="/zh-CN/docs/Web/CSS/ID_selectors">ID selector</a>）</dt> <dd>按照 <code>id</code> 属性选择一个与之匹配的元素。需要注意的是，一个文档中，每个 ID 属性都应当是唯一的。<br> <strong>语法：</strong><code>#<var>idname</var></code><br> <strong>例子：</strong><code>#toc</code> 匹配 ID 为 "toc" 的元素。</dd> - <dt><a href="/zh-CN/docs/Web/CSS/Attribute_selectors">属性选择器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Attribute_selectors">Attribute selector</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Attribute_selectors">属性选择器</a>（<a href="/zh-CN/docs/Web/CSS/Attribute_selectors">Attribute selector</a>）</dt> <dd>按照给定的属性，选择所有匹配的元素。<br> <strong>语法：</strong><code>[<var>attr</var>]</code> <code>[<var>attr</var>=<var>value</var>]</code> <code>[<var>attr</var>~=<var>value</var>]</code> <code>[<var>attr</var>|=<var>value</var>]</code> <code>[<var>attr</var>^=<var>value</var>]</code> <code>[<var>attr</var>$=<var>value</var>]</code> <code>[<var>attr</var>*=<var>value</var>]</code><br> <strong>例子：</strong><code>[autoplay]</code> 选择所有具有 <code>autoplay</code> 属性的元素（不论这个属性的值是什么）。</dd> @@ -49,7 +49,7 @@ translation_of: Web/CSS/CSS_Selectors <h2 id="分组选择器（Grouping_selectors）">分组选择器（Grouping selectors）</h2> <dl> - <dt><a href="/zh-CN/docs/Web/CSS/Selector_list">选择器列表</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Selector_list">Selector list</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Selector_list">选择器列表</a>（<a href="/zh-CN/docs/Web/CSS/Selector_list">Selector list</a>）</dt> <dd><code>,</code> 是将不同的选择器组合在一起的方法，它选择所有能被列表中的任意一个选择器选中的节点。<br> <strong>语法</strong>：<code style="white-space: nowrap;"><var>A</var>, <var>B</var></code><br> <strong>示例</strong>：<code>div, span</code> 会同时匹配 {{HTMLElement("span")}} 元素和 {{HTMLElement("div")}} 元素。</dd> @@ -58,19 +58,19 @@ translation_of: Web/CSS/CSS_Selectors <h2 id="组合器（Combinators）">组合器（Combinators）</h2> <dl> - <dt><a href="/zh-CN/docs/Web/CSS/Descendant_selectors">后代组合器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator">Descendant combinator</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Descendant_selectors">后代组合器</a>（<a href="/zh-CN/docs/Web/CSS/Descendant_combinator">Descendant combinator</a>）</dt> <dd><code> </code>（空格）组合器选择前一个元素的后代节点。<br> <strong>语法：</strong><code style="white-space: nowrap;"><var>A</var> <var>B</var></code><br> <strong>例子：</strong><code>div span</code> 匹配所有位于任意 {{HTMLElement("div")}} 元素之内的 {{HTMLElement("span")}} 元素。</dd> - <dt><a href="/zh-CN/docs/Web/CSS/Child_selectors">直接子代组合器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Child_combinator">Child combinator</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Child_selectors">直接子代组合器</a>（<a href="/zh-CN/docs/Web/CSS/Child_combinator">Child combinator</a>）</dt> <dd><code>></code> 组合器选择前一个元素的直接子代的节点。<br> <strong>语法</strong>：<code><var>A</var> > <var>B</var></code><br> <strong>例子</strong>：<code>ul > li</code> 匹配直接嵌套在 {{HTMLElement("ul")}} 元素内的所有 {{HTMLElement("li")}} 元素。</dd> - <dt><a href="/zh-CN/docs/Web/CSS/General_sibling_selectors">一般兄弟组合器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/General_sibling_combinator">General sibling combinator</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/General_sibling_selectors">一般兄弟组合器</a>（<a href="/zh-CN/docs/Web/CSS/General_sibling_combinator">General sibling combinator</a>）</dt> <dd><code>~</code> 组合器选择兄弟元素，也就是说，后一个节点在前一个节点后面的任意位置，并且共享同一个父节点。<br> <strong>语法</strong>：<code><var>A</var> ~ <var>B</var></code><br> <strong>例子</strong>：<code>p ~ span</code> 匹配同一父元素下，{{HTMLElement("p")}} 元素后的所有 {{HTMLElement("span")}} 元素。</dd> - <dt><a href="/zh-CN/docs/Web/CSS/Adjacent_sibling_selectors">紧邻兄弟组合器</a>（<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Adjacent_sibling_combinator">Adjacent sibling combinator</a>）</dt> + <dt><a href="/zh-CN/docs/Web/CSS/Adjacent_sibling_selectors">紧邻兄弟组合器</a>（<a href="/zh-CN/docs/Web/CSS/Adjacent_sibling_combinator">Adjacent sibling combinator</a>）</dt> <dd><code>+</code> 组合器选择相邻元素，即后一个元素紧跟在前一个之后，并且共享同一个父节点。<br> <strong>语法：</strong><code><var>A</var> + <var>B</var></code><br> <strong>例子：</strong><code>h2 + p</code> 会匹配所有紧邻在 {{HTMLElement("h2")}} 元素后的 {{HTMLElement("p")}} 元素。</dd> diff --git a/files/zh-cn/web/css/display/index.html b/files/zh-cn/web/css/display/index.html index 189002afdb..8605b74a25 100644 --- a/files/zh-cn/web/css/display/index.html +++ b/files/zh-cn/web/css/display/index.html @@ -6,7 +6,7 @@ tags: translation_of: Web/CSS/display --- <div>{{CSSRef}} -<p><strong><code>display</code></strong> 属性可以设置元素的内部和外部显示类型 <em>display types</em>。元素的外部显示类型 <em>outer display types</em> 将决定该元素在<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Flow_Layout">流式布局</a>中的表现（<a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout">块级或内联元素</a>）；元素的内部显示类型 <em>inner display types</em> 可以控制其子元素的布局（例如：<a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout">flow layout</a>，<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Grid_Layout">grid</a> 或 <a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout">flex</a>）。</p> +<p><strong><code>display</code></strong> 属性可以设置元素的内部和外部显示类型 <em>display types</em>。元素的外部显示类型 <em>outer display types</em> 将决定该元素在<a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout">流式布局</a>中的表现（<a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout">块级或内联元素</a>）；元素的内部显示类型 <em>inner display types</em> 可以控制其子元素的布局（例如：<a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout">flow layout</a>，<a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout">grid</a> 或 <a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout">flex</a>）。</p> </div> <p>在 <strong>CSS 规范</strong>（特指 CSS Level 1/2/3 规范）中查阅 <strong><code>display</code></strong> 属性的所有取值时需要注意：个别取值的详细信息记录在独立的规范中。 例如，<code>display: flex</code> 的详细信息在 <em>CSS Flexible Box Model</em> 规范中记录。可以在本文档末尾的表格中查看所有有关的规范。</p> @@ -75,7 +75,7 @@ translation_of: Web/CSS/display } </pre> -<p>有关规范变更的更多信息，查阅文章 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/display/two-value_syntax_of_display">Adapting to the new two-value syntax of display</a>。</p> +<p>有关规范变更的更多信息，查阅文章 <a href="/zh-CN/docs/Web/CSS/display/two-value_syntax_of_display">Adapting to the new two-value syntax of display</a>。</p> <h3 id="全局设置">全局设置</h3> @@ -89,47 +89,47 @@ display: unset;</pre> <p>上面 {{anch("语法")}} 部分提供了 <strong><code>display</code></strong> 取值的多个示例。下面的资料将详细介绍 <strong><code>display</code></strong> 的各个取值。</p> <ul> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/display/two-value_syntax_of_display">接受 display 新的二值语法</a></li> + <li><a href="/zh-CN/docs/Web/CSS/display/two-value_syntax_of_display">接受 display 新的二值语法</a></li> </ul> <h3 id="CSS_Flow_Layout_display_block_display_inline">CSS Flow Layout (<code>display: block</code>, <code>display: inline</code>)</h3> <ul> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow">块级和内联元素在正常流中的布局</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Flow_Layout_and_Overflow">流布局和溢出</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Flow_Layout_and_Writing_Modes">流布局和书写方法</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Formatting_Contexts_Explained">Formatting Contexts Explained</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/In_Flow_and_Out_of_Flow">流内和流外</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow">块级和内联元素在正常流中的布局</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout/Flow_Layout_and_Overflow">流布局和溢出</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout/Flow_Layout_and_Writing_Modes">流布局和书写方法</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout/Formatting_Contexts_Explained">Formatting Contexts Explained</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout/In_Flow_and_Out_of_Flow">流内和流外</a></li> </ul> <h3 id="display_flex"><code>display: flex</code></h3> <ul> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox">弹性盒模型的基本概念</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox">弹性盒模型的基本概念</a></li> <li>在弹性容器中对齐项目</li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Controlling Ratios of Flex Items Along the Main Axis</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Mixins">Cross-browser Flexbox mixins</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items">Mastering Wrapping of Flex Items</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Ordering_Flex_Items">Ordering Flex Items</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Relationship_of_Flexbox_to_Other_Layout_Methods">Relationship of flexbox to other layout methods</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexbox">Backwards Compatibility of Flexbox</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox">Typical use cases of Flexbox</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Controlling Ratios of Flex Items Along the Main Axis</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Mixins">Cross-browser Flexbox mixins</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Mastering_Wrapping_of_Flex_Items">Mastering Wrapping of Flex Items</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Ordering_Flex_Items">Ordering Flex Items</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Relationship_of_Flexbox_to_Other_Layout_Methods">Relationship of flexbox to other layout methods</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Backwards_Compatibility_of_Flexbox">Backwards Compatibility of Flexbox</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Typical_Use_Cases_of_Flexbox">Typical use cases of Flexbox</a></li> </ul> <h3 id="display_grid"><code>display: grid</code></h3> <ul> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Basic Concepts of Grid Layout</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relationship to other layout methods</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Line-based placement</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Grid template areas</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Layout using named grid lines</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Auto-placement in grid layout</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box alignment in grid layout</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Grids, logical values and writing modes</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout and Accessibility</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout and Progressive Enhancement</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Realizing common layouts using grids</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Basic_Concepts_of_Grid_Layout">Basic Concepts of Grid Layout</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Relationship_of_Grid_Layout">Relationship to other layout methods</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Line-based_Placement_with_CSS_Grid">Line-based placement</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Grid_Template_Areas">Grid template areas</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Layout_using_Named_Grid_Lines">Layout using named grid lines</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Auto-placement_in_CSS_Grid_Layout">Auto-placement in grid layout</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Box_Alignment_in_CSS_Grid_Layout">Box alignment in grid layout</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid,_Logical_Values_and_Writing_Modes">Grids, logical values and writing modes</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_Layout_and_Accessibility">CSS Grid Layout and Accessibility</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/CSS_Grid_and_Progressive_Enhancement">CSS Grid Layout and Progressive Enhancement</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout/Realizing_common_layouts_using_CSS_Grid_Layout">Realizing common layouts using grids</a></li> </ul> <p>除此之外，你可以在 MDN 上找到布局模型的详细解释：</p> @@ -164,7 +164,7 @@ display: unset;</pre> <ul> <li><a class="external external-icon" href="https://developer.paciellogroup.com/blog/2018/03/short-note-on-what-css-display-properties-do-to-table-semantics/">Short note on what CSS display properties do to table semantics — The Paciello Group</a></li> <li><a class="external external-icon" href="https://gomakethings.com/hidden-content-for-better-a11y/">Hidden content for better a11y | Go Make Things</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.3_%E2%80%94_Create_content_that_can_be_presented_in_different_ways">MDN Understanding WCAG, Guideline 1.3 explanations</a></li> + <li><a href="/zh-CN/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.3_%E2%80%94_Create_content_that_can_be_presented_in_different_ways">MDN Understanding WCAG, Guideline 1.3 explanations</a></li> <li><a class="external external-icon" href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/content-structure-separation-programmatic.html">Understanding Success Criterion 1.3.1 | W3C Understanding WCAG 2.0</a></li> </ul> @@ -220,7 +220,7 @@ display: unset;</pre> <ul> <li><a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout/Block_and_Inline_Layout_in_Normal_Flow">Block and inline layout in normal flow</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flow_Layout/Intro_to_formatting_contexts">Introduction to formatting contexts</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Flow_Layout/Intro_to_formatting_contexts">Introduction to formatting contexts</a></li> <li>{{CSSxRef("visibility")}}, {{CSSxRef("float")}}, {{CSSxRef("position")}}</li> <li>{{CSSxRef("grid")}}, {{CSSxRef("flex")}}</li> </ul> diff --git a/files/zh-cn/web/css/flex-grow/index.html b/files/zh-cn/web/css/flex-grow/index.html index e341a60900..b71ba6bd03 100644 --- a/files/zh-cn/web/css/flex-grow/index.html +++ b/files/zh-cn/web/css/flex-grow/index.html @@ -10,7 +10,7 @@ translation_of: Web/CSS/flex-grow --- <div>{{CSSRef}}</div> -<p><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS">CSS</a>属性 <strong><code>flex-grow</code></strong>设置了一个flex项<a href="https://www.w3.org/TR/css-flexbox/#main-size">主尺寸</a>的flex增长系数。它指定了flex容器中剩余空间的多少应该分配给项目（flex增长系数）。</p> +<p><a href="/zh-CN/docs/Web/CSS">CSS</a>属性 <strong><code>flex-grow</code></strong>设置了一个flex项<a href="https://www.w3.org/TR/css-flexbox/#main-size">主尺寸</a>的flex增长系数。它指定了flex容器中剩余空间的多少应该分配给项目（flex增长系数）。</p> <p><a href="https://www.w3.org/TR/css-flexbox/#main-size">主尺寸</a>是项的宽度或高度，这取决于{{cssxref("flex-direction")}}值。</p> @@ -122,7 +122,7 @@ flex-grow: unset;</pre> <ul> <li><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Using_CSS_flexible_boxes" title="使用 CSS 弹性盒子">使用 CSS 弹性盒子</a></li> - <li>CSS Flexbox指南: <em><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox">Basic Concepts of Flexbox</a></em></li> - <li>CSS Flexbox指南: <em><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Controlling Ratios of flex items along the main axis</a></em></li> + <li>CSS Flexbox指南: <em><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Basic_Concepts_of_Flexbox">Basic Concepts of Flexbox</a></em></li> + <li>CSS Flexbox指南: <em><a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout/Controlling_Ratios_of_Flex_Items_Along_the_Main_Ax">Controlling Ratios of flex items along the main axis</a></em></li> <li><a href="https://css-tricks.com/flex-grow-is-weird/">`flex-grow` is weird. Or is it?</a> Manuel Matuzovic在CSS-Tricks上的文章，说明了flex-grow的工作原理。</li> </ul> diff --git a/files/zh-cn/web/css/gradient/linear-gradient()/index.html b/files/zh-cn/web/css/gradient/linear-gradient()/index.html index c8c25b68e2..df99cec0e6 100644 --- a/files/zh-cn/web/css/gradient/linear-gradient()/index.html +++ b/files/zh-cn/web/css/gradient/linear-gradient()/index.html @@ -101,7 +101,7 @@ linear-gradient(red 0%, orange 10% 30%, yellow 50% 70%, green 90% 100%);</code>< <h3 id="正式语法">正式语法</h3> <pre class="notranslate">linear-gradient( - [ <a href="https://wiki.developer.mozilla.org/en-US/CSS/angle"><angle></a> | to <side-or-corner> ,]? <color-stop-list> ) + [ <a href="/zh-CN/CSS/angle"><angle></a> | to <side-or-corner> ,]? <color-stop-list> ) \---------------------------------/ \----------------------------/ Definition of the gradient line List of color stops diff --git a/files/zh-cn/web/css/gradient/radial-gradient()/index.html b/files/zh-cn/web/css/gradient/radial-gradient()/index.html index 78750ad563..2b9cfeff39 100644 --- a/files/zh-cn/web/css/gradient/radial-gradient()/index.html +++ b/files/zh-cn/web/css/gradient/radial-gradient()/index.html @@ -91,10 +91,10 @@ radial-gradient(circle at center, red 0, blue, green 100%)</code></pre> <h3 id="Formal_syntax">Formal syntax</h3> <pre class="notranslate">radial-gradient( - [ [ circle || <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/length"><length></a> ] [ at <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/position_value"><position></a> ]? , | - [ ellipse || [ <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/length"><length></a> | <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/percentage"><percentage></a> ]{2} ] [ at <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/position_value"><position></a> ]? , | - [ [ circle | ellipse ] || <extent-keyword> ] [at <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/position_value"><position></a> ]? , | - at <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/position_value"><position></a> , + [ [ circle || <a href="/zh-CN/docs/CSS/length"><length></a> ] [ at <a href="/zh-CN/docs/CSS/position_value"><position></a> ]? , | + [ ellipse || [ <a href="/zh-CN/docs/CSS/length"><length></a> | <a href="/zh-CN/docs/CSS/percentage"><percentage></a> ]{2} ] [ at <a href="/zh-CN/docs/CSS/position_value"><position></a> ]? , | + [ [ circle | ellipse ] || <extent-keyword> ] [at <a href="/zh-CN/docs/CSS/position_value"><position></a> ]? , | + at <a href="/zh-CN/docs/CSS/position_value"><position></a> , ]? <color-stop-list> [ , <color-stop-list> ]+ ) diff --git a/files/zh-cn/web/css/layout_cookbook/contribute_a_recipe/index.html b/files/zh-cn/web/css/layout_cookbook/contribute_a_recipe/index.html index 37ceeddd92..58a0e5bd4c 100644 --- a/files/zh-cn/web/css/layout_cookbook/contribute_a_recipe/index.html +++ b/files/zh-cn/web/css/layout_cookbook/contribute_a_recipe/index.html @@ -81,7 +81,7 @@ translation_of: Web/CSS/Layout_cookbook/Contribute_a_recipe <p>If you need general guidance on using the MDN wiki, see the help pages available here.</p> -<p>If you need to ask any questions, or want someone to take a look at your page then the <a href="https://discourse.mozilla.org/c/mdn">MDN Discourse forum</a> is a good place to do this, or <a href="https://wiki.developer.mozilla.org/en-US/docs/MDN/Community/Conversations#Synchronous_chat">chat with us on Matrix</a>.</p> +<p>If you need to ask any questions, or want someone to take a look at your page then the <a href="https://discourse.mozilla.org/c/mdn">MDN Discourse forum</a> is a good place to do this, or <a href="/zh-CN/docs/MDN/Community/Conversations#Synchronous_chat">chat with us on Matrix</a>.</p> <h2 id="See_also">See also</h2> diff --git a/files/zh-cn/web/css/length/index.html b/files/zh-cn/web/css/length/index.html index 35276c797e..813bee1cce 100644 --- a/files/zh-cn/web/css/length/index.html +++ b/files/zh-cn/web/css/length/index.html @@ -118,7 +118,7 @@ translation_of: Web/CSS/length <h2 id="插值">插值</h2> -<p>当包含动画效果时，动画中<code><length></code>的值是由计算出的值使用插值法得出的浮点实数。插值的速度由动画的<a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/easing-function">定时函数</a>决定。</p> +<p>当包含动画效果时，动画中<code><length></code>的值是由计算出的值使用插值法得出的浮点实数。插值的速度由动画的<a href="/zh-CN/docs/Web/CSS/easing-function">定时函数</a>决定。</p> <h2 id="示例">示例</h2> diff --git a/files/zh-cn/web/css/list-style-type/index.html b/files/zh-cn/web/css/list-style-type/index.html index 6350c67987..fd7edd0e5d 100644 --- a/files/zh-cn/web/css/list-style-type/index.html +++ b/files/zh-cn/web/css/list-style-type/index.html @@ -10,13 +10,13 @@ translation_of: Web/CSS/list-style-type --- <div>{{CSSRef}}</div> -<p> <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS">CSS</a> 属性 <code>list-style-type</code> 可以设置列表元素的 marker（比如圆点、符号、或者自定义计数器样式）。</p> +<p> <a href="/zh-CN/docs/Web/CSS">CSS</a> 属性 <code>list-style-type</code> 可以设置列表元素的 marker（比如圆点、符号、或者自定义计数器样式）。</p> <div>{{EmbedInteractiveExample("pages/css/list-style-type.html")}}</div> -<p>The <a href="https://wiki.developer.mozilla.org/en-US/docs/CSS/color_value" title="color">color</a> of the marker will be the same as the computed color of the element it applies to.</p> +<p>The <a href="/zh-CN/docs/CSS/color_value" title="color">color</a> of the marker will be the same as the computed color of the element it applies to.</p> <p>只有几个元素 ({{HTMLElement("li")}} 和 {{HTMLElement("summary")}}) 的默认值为 <code>display: list-item</code>。 但是， <code>list-style-type</code> 属性可以应用在任何 {{cssxref("display")}} 的值为 <code>list-item</code> 的元素上。此外，由于这个属性是可继承的，它可以设置在父元素上 (通常是 {{HTMLElement("ol")}} 或 {{HTMLElement("ul")}}) 以便应用于所有子元素({{HTMLElement("li")}})。</p> @@ -49,10 +49,10 @@ list-style-type: unset; <p>list-style-type 的属性值可以是以下任意一项:</p> <ul> - <li>a <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/list-style-type$edit#%3Ccustom-ident%3E"><custom-ident></a></code> value</li> - <li>a <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/list-style-type$edit#symbols()">symbols()</a></code> value</li> - <li>a <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/list-style-type$edit#%3Cstring%3E"><string></a></code> value</li> - <li>the keyword <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/list-style-type$edit#none">none</a></code>.</li> + <li>a <code><a href="/zh-CN/docs/Web/CSS/list-style-type$edit#%3Ccustom-ident%3E"><custom-ident></a></code> value</li> + <li>a <code><a href="/zh-CN/docs/Web/CSS/list-style-type$edit#symbols()">symbols()</a></code> value</li> + <li>a <code><a href="/zh-CN/docs/Web/CSS/list-style-type$edit#%3Cstring%3E"><string></a></code> value</li> + <li>the keyword <code><a href="/zh-CN/docs/Web/CSS/list-style-type$edit#none">none</a></code>.</li> </ul> <h3 id="取值">取值</h3> @@ -499,7 +499,7 @@ ol.shortcut { <h2 id="Accessibility_concerns">Accessibility concerns</h2> -<p>The <a href="https://help.apple.com/voiceover/info/guide/">VoiceOver</a> screen reader has an issue where unordered lists with a <code>list-style-type</code>value of <code>none</code> applied to them will not be announced as a list. To address this, add a <a href="https://en.wikipedia.org/wiki/Zero-width_space">zero-width space</a> as <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/content">pseudo content</a> before each list item to ensure the list is announced properly. This ensures the design is unaffected by the bug fix and that list items are not improperly described.</p> +<p>The <a href="https://help.apple.com/voiceover/info/guide/">VoiceOver</a> screen reader has an issue where unordered lists with a <code>list-style-type</code>value of <code>none</code> applied to them will not be announced as a list. To address this, add a <a href="https://en.wikipedia.org/wiki/Zero-width_space">zero-width space</a> as <a href="/zh-CN/docs/Web/CSS/content">pseudo content</a> before each list item to ensure the list is announced properly. This ensures the design is unaffected by the bug fix and that list items are not improperly described.</p> <pre class="notranslate"><code>ul { list-style: none; @@ -511,7 +511,7 @@ ul li::before { <ul> <li><a href="https://unfetteredthoughts.net/2017/09/26/voiceover-and-list-style-type-none/">VoiceOver and list-style-type: none – Unfettered Thoughts</a></li> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.3_%E2%80%94_Create_content_that_can_be_presented_in_different_ways">MDN Understanding WCAG, Guideline 1.3 explanations</a></li> + <li><a href="/zh-CN/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.3_%E2%80%94_Create_content_that_can_be_presented_in_different_ways">MDN Understanding WCAG, Guideline 1.3 explanations</a></li> <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/content-structure-separation-programmatic.html" rel="noopener">Understanding Success Criterion 1.3.1 | W3C Understanding WCAG 2.0</a></li> </ul> diff --git a/files/zh-cn/web/css/media_queries/using_media_queries/index.html b/files/zh-cn/web/css/media_queries/using_media_queries/index.html index 0063d28a5a..375eedc7fb 100644 --- a/files/zh-cn/web/css/media_queries/using_media_queries/index.html +++ b/files/zh-cn/web/css/media_queries/using_media_queries/index.html @@ -369,7 +369,7 @@ original_slug: Web/Guide/CSS/Media_queries <p>媒体查询4级规范对语法进行了一些改进，以使用具有“范围”类型（例如宽度或高度，减少冗余）的功能进行媒体查询。 级别4添加了用于编写此类的查询范围上下文。 例如，使用最大宽度<code>max-</code> 功能，我们可以编写以下代码：</p> <div class="blockIndicator note"> -<p><strong>Note:</strong> 媒体查询4级规范在现代浏览器中具有合理的支持，但某些媒体功能并未得到很好的支持。 有关更多详细信息，请参见 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/@media#Browser_compatibility"><code>@media</code> browser compatibility table</a>。</p> +<p><strong>Note:</strong> 媒体查询4级规范在现代浏览器中具有合理的支持，但某些媒体功能并未得到很好的支持。 有关更多详细信息，请参见 <a href="/zh-CN/docs/Web/CSS/@media#Browser_compatibility"><code>@media</code> browser compatibility table</a>。</p> </div> <pre class="brush: css">@media (max-width: 30em) { ... }</pre> diff --git a/files/zh-cn/web/css/place-items/index.html b/files/zh-cn/web/css/place-items/index.html index 6c9d14db3e..eb53e9eceb 100644 --- a/files/zh-cn/web/css/place-items/index.html +++ b/files/zh-cn/web/css/place-items/index.html @@ -7,7 +7,7 @@ translation_of: Web/CSS/place-items -<p><a href="/en-US/docs/Web/CSS">CSS</a> 中的 <strong><code>place-items</code></strong> 是一个<a href="/en-US/docs/Web/CSS/Shorthand_properties">简写属性</a> ，它允许你在相关的布局（如 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout">Grid</a> 或 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a>）中可以同时沿着块级和内联方向对齐元素 (例如：{{CSSxRef("align-items")}} 和 {{CSSxRef("justify-items")}} 属性) 。如果未提供第二个值，则第一个值作为第二个值的默认值。</p> +<p><a href="/en-US/docs/Web/CSS">CSS</a> 中的 <strong><code>place-items</code></strong> 是一个<a href="/en-US/docs/Web/CSS/Shorthand_properties">简写属性</a> ，它允许你在相关的布局（如 <a href="/zh-CN/docs/Web/CSS/CSS_Grid_Layout">Grid</a> 或 <a href="/zh-CN/docs/Web/CSS/CSS_Flexible_Box_Layout">Flexbox</a>）中可以同时沿着块级和内联方向对齐元素 (例如：{{CSSxRef("align-items")}} 和 {{CSSxRef("justify-items")}} 属性) 。如果未提供第二个值，则第一个值作为第二个值的默认值。</p> <div>{{EmbedInteractiveExample("pages/css/place-items.html")}}</div> diff --git a/files/zh-cn/web/css/shorthand_properties/index.html b/files/zh-cn/web/css/shorthand_properties/index.html index 63af2be2be..f29a699b71 100644 --- a/files/zh-cn/web/css/shorthand_properties/index.html +++ b/files/zh-cn/web/css/shorthand_properties/index.html @@ -149,7 +149,7 @@ margin-left: 5px;</pre> <p>{{page("/zh-CN/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance", "Controlling_inheritance")}}</p> -<p>查看 <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Introduction_to_CSS/Cascade_and_inheritance">Cascade and inheritance</a> or <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/Cascade">Introducing the CSS Cascade</a> 了解更多关于继承的信息。</p> +<p>查看 <a href="/zh-CN/docs/Learn/CSS/Introduction_to_CSS/Cascade_and_inheritance">Cascade and inheritance</a> or <a href="/zh-CN/docs/Web/CSS/Cascade">Introducing the CSS Cascade</a> 了解更多关于继承的信息。</p> <h2 id="See_also" name="See_also">另请参阅</h2> diff --git a/files/zh-cn/web/css/specificity/index.html b/files/zh-cn/web/css/specificity/index.html index 61d41391f9..bf5ad8bb9a 100644 --- a/files/zh-cn/web/css/specificity/index.html +++ b/files/zh-cn/web/css/specificity/index.html @@ -38,7 +38,7 @@ translation_of: Web/CSS/Specificity <p><strong>通配选择符</strong>（universal selector）（{{CSSxRef("Universal_selectors", "*")}}）<strong>关系选择符</strong>（combinators）（{{CSSxRef("Adjacent_sibling_combinator", "+")}}, {{CSSxRef("Child_combinator", ">")}}, {{CSSxRef("General_sibling_combinator", "~")}}, <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Descendant_combinator" style="white-space: nowrap;">'<code> </code>'</a>, {{CSSxRef("Column_combinator", "||")}}）和 <strong>否定伪类</strong>（negation pseudo-class）（{{CSSxRef(":not", ":not()")}}）对优先级没有影响。（但是，在<strong> </strong> <code>:not()</code> 内部声明的选择器会影响优先级）。</p> -<p>您可以访问 <a href="https://wiki.developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance#Specificity_2">"Specificity" in "Cascade and inheritance"</a> 或者 <a href="https://specifishity.com/">https://specifishity.com</a> 来了解更多关于优先级的详细信息。</p> +<p>您可以访问 <a href="/zh-CN/docs/Learn/CSS/Building_blocks/Cascade_and_inheritance#Specificity_2">"Specificity" in "Cascade and inheritance"</a> 或者 <a href="https://specifishity.com/">https://specifishity.com</a> 来了解更多关于优先级的详细信息。</p> <p>给元素添加的<strong>内联样式</strong> (例如，<code>style="font-weight:bold"</code>) 总会覆盖外部样式表的任何样式 ，因此可看作是具有最高的优先级。</p> diff --git a/files/zh-cn/web/css/transform-function/matrix()/index.html b/files/zh-cn/web/css/transform-function/matrix()/index.html index 61a7db5124..85c5d7bc8e 100644 --- a/files/zh-cn/web/css/transform-function/matrix()/index.html +++ b/files/zh-cn/web/css/transform-function/matrix()/index.html @@ -81,4 +81,4 @@ translation_of: Web/CSS/transform-function/matrix() <h3 id="结果">结果</h3> -<p>请看英文版案例 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/transform-function/matrix#Result">https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/transform-function/matrix#Result</a></p> +<p>请看英文版案例 <a href="/zh-CN/docs/Web/CSS/transform-function/matrix#Result">/zh-CN/docs/Web/CSS/transform-function/matrix#Result</a></p> diff --git a/files/zh-cn/web/css/transform-function/translatey()/index.html b/files/zh-cn/web/css/transform-function/translatey()/index.html index 3c210ee62e..cbce9c8b14 100644 --- a/files/zh-cn/web/css/transform-function/translatey()/index.html +++ b/files/zh-cn/web/css/transform-function/translatey()/index.html @@ -105,7 +105,7 @@ transform: translateY(50%);</code></pre> <h2 id="浏览器兼容性">浏览器兼容性</h2> -<p>请查看 <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/CSS/transform-function#Browser_compatibility"><transform-function></a></code>。</p> +<p>请查看 <code><a href="/zh-CN/docs/Web/CSS/transform-function#Browser_compatibility"><transform-function></a></code>。</p> <h2 id="了解更多">了解更多</h2> diff --git a/files/zh-cn/web/css/using_css_custom_properties/index.html b/files/zh-cn/web/css/using_css_custom_properties/index.html index daeae20d1a..60ff3a2bad 100644 --- a/files/zh-cn/web/css/using_css_custom_properties/index.html +++ b/files/zh-cn/web/css/using_css_custom_properties/index.html @@ -177,7 +177,7 @@ translation_of: Web/CSS/Using_CSS_custom_properties <h2 id="自定义属性备用值">自定义属性备用值</h2> -<p>用 {{cssxref("var()")}} 函数可以定义多个<strong>备用值</strong>(fallback value)，当给定值未定义时将会用备用值替换。这对于 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Web_Components/Using_custom_elements">Custom Elements</a> 和 <a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Web_Components/Using_shadow_DOM">Shadow DOM</a> 都很有用。</p> +<p>用 {{cssxref("var()")}} 函数可以定义多个<strong>备用值</strong>(fallback value)，当给定值未定义时将会用备用值替换。这对于 <a href="/zh-CN/docs/Web/Web_Components/Using_custom_elements">Custom Elements</a> 和 <a href="/zh-CN/docs/Web/Web_Components/Using_shadow_DOM">Shadow DOM</a> 都很有用。</p> <div class="blockIndicator note"> <p><strong><u>备用值</u>并不是用于实现浏览器兼容性的。</strong>如果浏览器不支持CSS自定义属性，备用值也没什么用。<strong>它仅对支持CSS自定义属性的浏览器提供了一个备份机制</strong>，该机制仅当给定值未定义或是无效值的时候生效。</p> diff --git a/files/zh-cn/web/css/width/index.html b/files/zh-cn/web/css/width/index.html index 9bcfdb63af..aee395afbf 100644 --- a/files/zh-cn/web/css/width/index.html +++ b/files/zh-cn/web/css/width/index.html @@ -42,8 +42,8 @@ width: unset; <p><code>width</code> 属性也指定为：</p> <ul> - <li>下面关键字值之一：<code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/width$edit#min-content">min-content</a></code>，<code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/width$edit#max-content">max-content</a></code>，<code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/width$edit#fit-content">fit-content</a></code>，<code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/width$edit#auto">auto</a></code>。</li> - <li>一个长度值 <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/width$edit#%3Clength%3E"><length></a></code> 或者百分比值 <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/width$edit#%3Cpercentage%3E"><percentage></a></code>。</li> + <li>下面关键字值之一：<code><a href="/zh-CN/docs/Web/CSS/width$edit#min-content">min-content</a></code>，<code><a href="/zh-CN/docs/Web/CSS/width$edit#max-content">max-content</a></code>，<code><a href="/zh-CN/docs/Web/CSS/width$edit#fit-content">fit-content</a></code>，<code><a href="/zh-CN/docs/Web/CSS/width$edit#auto">auto</a></code>。</li> + <li>一个长度值 <code><a href="/zh-CN/docs/Web/CSS/width$edit#%3Clength%3E"><length></a></code> 或者百分比值 <code><a href="/zh-CN/docs/Web/CSS/width$edit#%3Cpercentage%3E"><percentage></a></code>。</li> </ul> <h3 id="值">值</h3> @@ -148,7 +148,7 @@ width: unset; <p>当页面放大以增加文本大小时，请确保 <code>width</code> 设置的元素不会被截断并且不会遮挡其他内容。</p> <ul> - <li><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.4_Make_it_easier_for_users_to_see_and_hear_content_including_separating_foreground_from_background">MDN Understanding WCAG, Guideline 1.4 explanations</a></li> + <li><a href="/zh-CN/docs/Web/Accessibility/Understanding_WCAG/Perceivable#Guideline_1.4_Make_it_easier_for_users_to_see_and_hear_content_including_separating_foreground_from_background">MDN Understanding WCAG, Guideline 1.4 explanations</a></li> <li><a href="https://www.w3.org/TR/UNDERSTANDING-WCAG20/visual-audio-contrast-scale.html" rel="noopener">Understanding Success Criterion 1.4.4 | Understanding WCAG 2.0</a></li> </ul> diff --git a/files/zh-cn/web/css/writing-mode/index.html b/files/zh-cn/web/css/writing-mode/index.html index ea47547767..4eaba44816 100644 --- a/files/zh-cn/web/css/writing-mode/index.html +++ b/files/zh-cn/web/css/writing-mode/index.html @@ -193,12 +193,12 @@ th { <h2 id="请参阅">请参阅</h2> <ul> - <li>SVG <code><a href="https://wiki.developer.mozilla.org/en-US/docs/Web/SVG/Attribute/writing-mode">writing-mode</a></code> attribute</li> + <li>SVG <code><a href="/zh-CN/docs/Web/SVG/Attribute/writing-mode">writing-mode</a></code> attribute</li> <li>{{Cssxref("direction")}}</li> <li>{{Cssxref("unicode-bidi")}}</li> <li>{{Cssxref("text-orientation")}}</li> <li>{{Cssxref("text-combine-upright")}}</li> - <li><a href="https://wiki.developer.mozilla.org/docs/Web/CSS/CSS_Logical_Properties">CSS Logical properties</a></li> + <li><a href="/zh-CN/docs/Web/CSS/CSS_Logical_Properties">CSS Logical properties</a></li> <li><a href="https://www.w3.org/International/articles/vertical-text/">Styling vertical text (Chinse, Japanese, Korean and Mongolian)</a></li> <li>Extensive browsers support test results: <a href="https://w3c.github.io/i18n-tests/results/writing-mode-vertical">https://w3c.github.io/i18n-tests/results/writing-mode-vertical</a></li> </ul> diff --git a/files/zh-cn/web/css/z-index/index.html b/files/zh-cn/web/css/z-index/index.html index ea8919ea70..7ef2adc6c2 100644 --- a/files/zh-cn/web/css/z-index/index.html +++ b/files/zh-cn/web/css/z-index/index.html @@ -38,7 +38,7 @@ z-index: inherit; z-index: initial; z-index: unset;</pre> -<p><code>z-index</code> 属性可以被设定为关键词 <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/z-index$edit#auto">auto</a></code> 或 <code><a href="https://wiki.developer.mozilla.org/zh-CN/docs/Web/CSS/z-index$edit#<integer>"><integer></a></code>。</p> +<p><code>z-index</code> 属性可以被设定为关键词 <code><a href="/zh-CN/docs/Web/CSS/z-index$edit#auto">auto</a></code> 或 <code><a href="/zh-CN/docs/Web/CSS/z-index$edit#<integer>"><integer></a></code>。</p> <h3 id="取值">取值</h3> |