CSS背景重复线性渐变

Question

任何人都可以解释＆＃34; 0 / 15px 15px＆＃34;在以下css属性的末尾？

background: repeating-linear-gradient(45deg, #2b2b2b 0%, #2b2b2b 10%, #222222 0%, #222222 50%) 0 / 15px 15px;

Source

Answer 1

这是一个等同于：

的简写

background-image: repeating-linear-gradient(45deg, #2b2b2b 0%, #2b2b2b 10%, #222222 0%, #222222 50%)
background-position-x: 0;
background-size: 15px 15px;

由于background-position和background-size都可以处理15px 15px或0等值，因此斜杠为浏览器提供了区分两者的方法。 Position应该始终在size as defined in the spec之前。