javascript - d3.js 中奇怪的“初始”值

Question

通过执行与此( )类似的代码d3.select(..).append("div")，我得到div具有此类样式属性的 s：

<div id="id6" 
  style="
    background-image: initial; 
    background-attachment: initial; 
    background-origin: initial; 
    background-clip: initial; 
    background-color: rgb(255, 255, 255); 
    background-position: initial initial; 
    background-repeat: initial initial; ">
5
</div>

问题：

1. a)initial从哪里来？b) 是否可以重新定义“默认值”？
2. d3 在属性中乱扔不必要的值可以吗？
3. Chrome 这么说background-position: initial initial;并且 background-repeat: initial initial;是Invalid property values。是d3的bug吗？我们如何处理这个错误？

Answer 1

这与 D3 无关，而是与 CSS 的隐含性质有关。当您指定 CSS背景属性时，您实际上是在简写指定多个属性。例如，

background: url(chess.png) gray 50% repeat fixed;

实际上是简写

background-image: url(chess.png);
background-color: gray;
background-position: 50% 50%;
background-repeat: repeat;
background-attachment: fixed;

So, when you set the style "background", your browser automatically expands this shorthand to the full form. That's why you see all of these additional styles; they represent the computed values.