前端 - CSS3问题：请问-webkit-background-clip属性，需要写在background属性后面吗？
问题描述
<!DOCTYPE html><html><head><meta charset='utf-8'><title>background-clip:text</title><meta name='description' content=''><meta name='keywords' content=''><link href='https://www.haobala.com/wenda/6013.html' rel='stylesheet'><style>*{margin: 0; padding: 0;}p{width: 300px; height: 60px; border: 1px solid #000; margin: 50px auto; font-size: 50px; font-weight: bold; text-align: center; line-height: 60px; /* -webkit-background-clip: text; 写在background上面则clip不生效*/ background: -webkit-linear-gradient(red,blue); -webkit-background-clip: text; /*写在background属性下面，正常*/ color: rgba(0,0,0,0);}</style></head><body> <p>你好啊！</p> </body></html>
请问一下，为什么 -webkit-background-clip:text;，需要写在background属性的后面，clip才能生效？谢谢！
问题解答
回答1：CSS简写属性：
没有指定的值会被设置为它的初始值。这听起来似乎本来就很合理的样子，但这确实意味着，它将会覆盖之前设置的值。
MDN---CSS的简写属性
当-webkit-background-clip属性写在background属性后面，-webkit-background-clip就覆盖了默认值，所以就起作用了。反之，正好相反。
回答2：最后识别的一个就是有效的。无论是那个属性都是一样的。所以，一定要确保想要保留的写在最后。
网公网安备