前端 - CSS3問(wèn)題：請(qǐng)問(wèn)-webkit-background-clip屬性，需要寫在background屬性后面嗎？
問(wèn)題描述
<!DOCTYPE html><html><head><meta charset='utf-8'><title>background-clip:text</title><meta name='description' content=''><meta name='keywords' content=''><link href='http://www.intensediesel.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>
請(qǐng)問(wèn)一下，為什么 -webkit-background-clip:text;，需要寫在background屬性的后面，clip才能生效？謝謝！
問(wèn)題解答
回答1：CSS簡(jiǎn)寫屬性：
沒(méi)有指定的值會(huì)被設(shè)置為它的初始值。這聽起來(lái)似乎本來(lái)就很合理的樣子，但這確實(shí)意味著，它將會(huì)覆蓋之前設(shè)置的值。
MDN---CSS的簡(jiǎn)寫屬性
當(dāng)-webkit-background-clip屬性寫在background屬性后面，-webkit-background-clip就覆蓋了默認(rèn)值，所以就起作用了。反之，正好相反。
回答2：最后識(shí)別的一個(gè)就是有效的。無(wú)論是那個(gè)屬性都是一樣的。所以，一定要確保想要保留的寫在最后。
網(wǎng)公網(wǎng)安備