爲什麼這個背景屬性會重複多次？

我仍然試圖清理CSS並試圖理解作者的意思。我總是試圖瞭解某人做了什麼，因爲我認爲人們很聰明，如果他們這樣做了，必須有一個原因。爲什麼這個背景屬性會重複多次？

通常它是名稱更改屬性（-webkit-box-shadow，-moz-box-shadow，box-shadow等）但在這裏它的價值，我從來沒有看到過。

看來他試圖多次覆蓋這個background屬性。我從來沒有見過這個。這是一個好的或壞的做法，如果這是一個不好的做法應該是什麼寫這個CSS的清潔方式：

.nav.side-menu> li.active > a { 
    color: #ff0000; 
    text-shadow: rgba(0, 0, 0, 0.25) 0 -1px 0; 
    background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5b6479), color-stop(100%, #4c5566)), #686e78; 
    background: -webkit-linear-gradient(#334556, #2C4257), #2A3F54; 
    background: -moz-linear-gradient(#334556, #2C4257), #2A3F54; 
    background: -o-linear-gradient(#334556, #2C4257), #2A3F54; 
    background: linear-gradient(#334556, #2C4257), #2A3F54; 
    -webkit-box-shadow: rgba(0, 0, 0, 0.25) 0 1px 0, inset rgba(255, 255, 255, 0.16) 0 1px 0; 
    -moz-box-shadow: rgba(0, 0, 0, 0.25) 0 1px 0, inset rgba(255, 255, 255, 0.16) 0 1px 0; 
    box-shadow: rgba(0, 0, 0, 0.25) 0 1px 0, inset rgba(255, 255, 255, 0.16) 0 1px 0; 
}

這裏的PyCharm如何看待CSS：只有background: -moz-linear-gradient(#334556, #2C4257), #2A3F54;被稱爲...

來源

2017-04-25 Olivier Pons

重寫通常意味着瀏覽器兼容性問題。否則它也可能是懶惰;） – manelgarcia

@manelgarcia感謝您的評論...但它是一個評論或anwser？如果你可以回答更多的細節，那真的很友善...... –

那些是供應商前綴。更多這裏 - > https://developer.mozilla.org/en-US/docs/Glossary/Vendor_Prefix – sol

這些vendor prefixes，dev的不試圖重寫的屬性很多次，他在做什麼，因爲有一些CSS化子性質是實驗性或罕見的CSS瀏覽器兼容性的這個瀏覽器支持的版本開發者正在使用。

所以-moz-是Mozilla Firefox瀏覽器，-webkit-是Chrome瀏覽器，Safari和Opera（或更新版本），-ms-是微軟Explorer和Edge和-o-是歌劇獨自在老版本。

當你遇到類似這樣的事情就像代碼對瀏覽器說的「嗨，我知道也許你知道這個屬性，我知道它的名字x但也許你知道它的名字-vendor-x 「

但請參閱鏈接瞭解更多信息。希望它有助於:)

來源

2017-04-25 13:03:39

您的鏈接是西班牙人:) ...但我想知道爲什麼PyCharm認爲它被覆蓋？不是，是嗎？ –

哦，對不起，有一個新的鏈接。它表現爲好像它已經重寫了css，即使你進入瀏覽器開發者控制檯，它也會以這種方式顯示，但它更像是消除不適合該瀏覽器的代碼。如果沒有供應商前綴，某些css可能無法在特定瀏覽器上呈現。 –

爲什麼這個背景屬性會重複多次？

回答

相關問題