From 869dd2069c695ee7040cd3261713212155819f42 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Mon, 14 Dec 2020 12:18:12 -0500 Subject: final dump 2020-12-14 --- files/zh-cn/web/css/background-image/index.html | 16 ++--- files/zh-cn/web/css/flex/index.html | 10 +-- files/zh-cn/web/css/gradient/index.html | 26 ++++---- files/zh-cn/web/css/image/index.html | 86 ++----------------------- 4 files changed, 32 insertions(+), 106 deletions(-) (limited to 'files/zh-cn/web/css') diff --git a/files/zh-cn/web/css/background-image/index.html b/files/zh-cn/web/css/background-image/index.html index c16d7aa861..cf4b302680 100644 --- a/files/zh-cn/web/css/background-image/index.html +++ b/files/zh-cn/web/css/background-image/index.html @@ -30,7 +30,7 @@ translation_of: Web/CSS/background-image

可以提供由逗号分隔的多个值来指定多个背景图像：

-
background-image:
+
background-image:
   linear-gradient(to bottom, rgba(255,255,0,0.5), rgba(0,0,255,0.5)),
   url('https://mdn.mozillademos.org/files/7693/catfront.png');

 
@@ -45,15 +45,15 @@ translation_of: Web/CSS/background-image
 
 
正规语法

 
-
{{csssyntax}}

+
{{csssyntax}}

 
-
示例

+
示例

 
 
注意星星图片部分透明且位于猫图片上方.

 
-
HTML

+
HTML

 
-
<div>
+
<div>
   <p class="catsandstars">
     This paragraph is full of cats<br />and stars.
   </p>
@@ -64,9 +64,9 @@ translation_of: Web/CSS/background-image
   <p>And no more.</p>
 </div>

 
-
CSS

+
CSS

 
-
p {
+
p {
   font-size: 1.5em;
   color: #FE7F88;
   background-image: none;
@@ -86,7 +86,7 @@ div {
 }
 

 
-
Result

+
运行结果

 
 
{{EmbedLiveSample('Examples')}}

 
diff --git a/files/zh-cn/web/css/flex/index.html b/files/zh-cn/web/css/flex/index.html
index 9911e9c77d..295d7d9f34 100644
--- a/files/zh-cn/web/css/flex/index.html
+++ b/files/zh-cn/web/css/flex/index.html
@@ -65,9 +65,9 @@ flex: unset;
 
单值语法: 值必须为以下其中之一:

 
 
    
- 
  • 一个无单位数({{cssxref("<number>")}}): 它会被当作<flex-grow>的值。
    • 
+ 
  • 一个无单位数({{cssxref("<number>")}}): 它会被当作flex:<number> 1 0; <flex-shrink>的值被假定为1，然后<flex-basis> 的值被假定为0。
    • 
  
  • 一个有效的宽度({{cssxref("width")}})值: 它会被当作 <flex-basis>的值。
    • 
- 
  • 关键字none，auto或initial.
    • 
+ 
  • 关键字none，auto或initial.
    • 
 

 
 
双值语法: 第一个值必须为一个无单位数，并且它会被当作 <flex-grow> 的值。第二个值必须为以下之一：

@@ -93,16 +93,16 @@ flex: unset;
 
 
 

- 
auto

+ 
auto

  
元素会根据自身的宽度与高度来确定尺寸，但是会伸长并吸收 flex 容器中额外的自由空间，也会缩短自身来适应 flex 容器。这相当于将属性设置为 "flex: 1 1 auto".

- 
none

+ 
none

  
元素会根据自身宽高来设置尺寸。它是完全非弹性的：既不会缩短，也不会伸长来适应 flex 容器。相当于将属性设置为"flex: 0 0 auto"。

  
<'flex-grow'>

  
定义 flex 项目的 {{cssxref("flex-grow")}} 。负值无效。省略时默认值为 1。 (初始值为 0)

  
<'flex-shrink'>

  
定义 flex 元素的 {{cssxref("flex-shrink")}} 。负值无效。省略时默认值为1。 (初始值为 1)

  
<'flex-basis'>

- 
定义 flex 元素的 {{cssxref("flex-basis")}} 属性。若值为0，则必须加上单位，以免被视作伸缩性。省略时默认值为 auto。(初始值为 0)

+ 
定义 flex 元素的 {{cssxref("flex-basis")}} 属性。若值为0，则必须加上单位，以免被视作伸缩性。省略时默认值为 0。(初始值为 auto)

  

  
描述

  

diff --git a/files/zh-cn/web/css/gradient/index.html b/files/zh-cn/web/css/gradient/index.html
index 8cb033cb7b..a27da647f1 100644
--- a/files/zh-cn/web/css/gradient/index.html
+++ b/files/zh-cn/web/css/gradient/index.html
@@ -21,16 +21,16 @@ translation_of: Web/CSS/gradient
 
颜色值沿着一条隐式的直线逐渐过渡。由{{cssxref("linear-gradient", "linear-gradient()")}}产生。

 
 
 
-
.linear-gradient {
+
.linear-gradient {
   background: linear-gradient(to right,
       red, orange, yellow, green, blue, indigo, violet);
 }

@@ -44,16 +44,16 @@ translation_of: Web/CSS/gradient
 
颜色值由一个中心点（原点）向外扩散并逐渐过渡到其他颜色值。由{{cssxref("radial-gradient", "radial-gradient()")}}函数产生。

 
 
 
-
.radial-gradient {
+
.radial-gradient {
   background: radial-gradient(red, yellow, rgb(30, 144, 255));
 }
 

@@ -67,18 +67,18 @@ translation_of: Web/CSS/gradient
 
重复多次渐变图案直到足够填满指定元素。由 {{cssxref("repeating-linear-gradient", "repeating-linear-gradient()")}}和{{cssxref("repeating-radial-gradient", "repeating-radial-gradient()")}}函数产生。

 
 
 
-
.linear-repeat {
+
.linear-repeat {
   background: repeating-linear-gradient(to top left,
       lightpink, lightpink 5px, white 5px, white 10px);
 }
@@ -115,7 +115,11 @@ translation_of: Web/CSS/gradient
 
 
浏览器兼容性

 
-
每一种渐变都有不同的兼容性，敬请查阅特定渐变的相关文献与资料以获取更多信息。

+
+
+
+
+
{{Compat("css.types.image.gradient")}}

 
 
See also

 
@@ -123,5 +127,3 @@ translation_of: Web/CSS/gradient
  
  • Using CSS gradients,
    • 
  
  • 渐变方程：{{cssxref("<gradient>")}}, {{cssxref("linear-gradient", "linear-gradient()")}}, {{cssxref("radial-gradient", "radial-gradient()")}}, {{cssxref("repeating-linear-gradient", "repeating-linear-gradient()")}}, {{cssxref("repeating-radial-gradient", "repeating-radial-gradient()")}};
    • 
 
-
-
     
    
diff --git a/files/zh-cn/web/css/image/index.html b/files/zh-cn/web/css/image/index.html
index c19fb0521e..99deceb577 100644
--- a/files/zh-cn/web/css/image/index.html
+++ b/files/zh-cn/web/css/image/index.html
@@ -81,7 +81,7 @@ translation_of: Web/CSS/image
 
 
    以下是有效的图像引用值：
    
 
-
    url(test.jpg)                          url()方法, 只要test.jpg是图像文件
+
    url(test.jpg)                          url()方法, 只要test.jpg是图像文件
 linear-gradient(to bottom, blue, red)  一个 <gradient>标签
 element(#colonne3)                     页面的一部分, 使用了element()方法,
                                        如果 colonne3 是存在于页面中的一个元素id即可
@@ -89,7 +89,7 @@ element(#colonne3)                     页面的一部分, 
 
 
    以下是无效的图像引用值：
    
 
-
    cervin.jpg                             图像文件必须使用url()方法定义
+
    cervin.jpg                             图像文件必须使用url()方法定义
 url(report.pdf)                        url()方法指向的文件链接必须是一个图像文件
 element(#fakeid)                       如果fakeid是一个不存在与页面的元素id
 
    
@@ -117,87 +117,11 @@ element(#fakeid)                       如果fakeid是一个不存在与页面
 
 
    浏览器兼容性
    
 
-
    {{ CompatibilityTable() }}
    
-
-
    
-
- 
-  
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-  
- 
-
    FeatureFirefox (Gecko)ChromeInternet ExplorerOperaSafari
    <uri>{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}
    <gradient>{{ compatVersionUnknown() }}
    
-    limited to {{ cssxref("background-image") }} & {{ cssxref("background") }}{{ property_prefix("-moz") }}    		{{ compatVersionUnknown() }}{{ property_prefix("-webkit") }}IE 10{{ property_prefix("-ms") }}{{ compatVersionUnknown() }}{{ property_prefix("-o") }}{{ compatVersionUnknown() }}{{ property_prefix("-webkit") }}
    element()4.0 (2.0) limited to {{ cssxref("background-image") }} & {{ cssxref("background") }}{{ property_prefix("-moz") }}{{ compatUnknown() }}{{ compatUnknown() }}{{ compatUnknown() }}{{ compatUnknown() }}
    
+
 
-
    
-
- 
-  
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-  
-  
-   
-   
-   
-   
-   
-   
-  
- 
-
    FeatureFirefox Mobile (Gecko)AndroidIE PhoneOpera MobileSafari Mobile
    <uri>{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}{{ compatVersionUnknown() }}
    <gradient>{{ compatVersionUnknown() }}
    
-    limited to {{ cssxref("background-image") }} & {{ cssxref("background") }}{{ property_prefix("-moz") }}    		{{ compatUnknown() }}{{ compatUnknown() }}{{ compatUnknown() }}{{ compatUnknown() }}
    element()4.0 (2.0) limited to {{ cssxref("background-image") }} & {{ cssxref("background") }}{{ property_prefix("-moz") }}{{ compatUnknown() }}{{ compatUnknown() }}{{ compatUnknown() }}{{ compatUnknown() }}
    
-
    
+
    {{Compat("css.types.image")}}
    
 
 
    参阅：
    
 
-- 
cgit v1.2.3-54-g00ecf