这段css是怎么实现的？

Question

.a{
    background: linear-gradient(black, black) left top,
                linear-gradient(black, black) left top,
                linear-gradient(black, black) right top,
                linear-gradient(black, black) right top,
                linear-gradient(black, black) right bottom,
                linear-gradient(black, black) right bottom,
                linear-gradient(black, black) left bottom,
                linear-gradient(black, black) left bottom;
    background-repeat: no-repeat;
    background-size: 4px 20px, 20px 4px;
    height: 56px;
    width: 176px;
 }

表现如下：

1.第一次见到这样写的background-size，没有找到相关说明文档TAT，这样写是什么意思啊？
2.linear-gradient(black, black)既然是black，black，那四舍五入等于没有渐变，为什么我把linear-gradient(black, black)替换为black之后就无法实现相同效果了？

Answer 1

linear-gradient(black, black)相当是设置background-image可以多个，而直接black相当于background-color这个只能写一个。
background-size: 4px 20px, 20px 4px;根据逗号按循序对应linear-gradient(black, black)的大小，并会循环。
第一个linear-gradient(black, black)对应4px 20px,
第二个linear-gradient(black, black)对应20px 4px,
第三个linear-gradient(black, black)对应4px 20px，以此类推。

Answer 2

文档没有? 那是不可能滴
去瞅瞅

Answer 3

这种写法确实很少见...
1.background-size:可以通过像素“px”精确地设置背景图片的大小。需要设置为两个值，第一个值表示背景图的宽度，第二个值表示背景图的高度，还可以通过设置宽度或高度的其中一个，将另外一个值设置成“auto”达到保持背景图原始图像比例的效果。如：“240px 120px”、“180px auto”或“auto（相当于还原默认的大小）”
2.至于渐变可以看看这篇文章的用法理解渐变https://www.w3cplus.com/css3/...