¿Qué significan las propiedades CSS semitransparentes en Google Chrome Dev Tools?

Question

consulte el siguiente cuadro:

¿Por qué es padding-topmargin-top y totalmente opaco, pero no padding-right etc.?

Answer 1

Creo que son semitransparentes porque no están explícitamente definidos.

Consired hoja siguiente:

selector1 { 
    margin: 20px; 
} 

selector2 { 
    margin: 20px; 
    margin-top: 10px; 
} 

selector3 { 
    margin: 10px 20px 30px; 
} 

En primer ejemplo (selector1) todos los margin-* propiedades serán semi-transparente porque no se define explícitamente - está siendo utilizado de acceso directo.

En el segundo ejemplo (selector2), solo margin-top será completamente opaco, como se define en su propiedad.

En último ejemplo (selector3), margin-top y margin-bottom se definen explícitamente, por lo tanto el habrá totalmente opaco. Sin embargo, margin-left y margin-right están definidos por un solo valor, por lo que serán semitransparentes.

---

de color semitransparente también se aplica a los valores por defecto, por ejemplo:

background: red url(...) no-repeat; 

Esta propiedad definida background-color, background-image y background-repeat explícitamente, sin embargo background-position, background-clip, background-size etc. no están definidos (se usan valores predeterminados) para que se vean como semitransparentes.