有時我們嘗試用盡可能少的行編寫CSS樣式表。覆蓋CSS中的樣式不好嗎？
讓我們看看這個例子：
注：此前borders所有width:1px，border-style:solid和border-color:#000
情景： 我們希望改變：
width：R，L和B 0pxborder-color：噸至#ddd代碼中使用：
border:0 solid #ddd;
border-top-width:1px;
什麼做的上面的代碼做了不必要的事情嗎？：
border-color：R，L和B（3個動作）width：T（1個動作）這裏是0不必要的代碼動作：
border-right-width:0;
border-bottom-width:0;
border-left-width:0;
border-top-color:#ddd;
問題是：我們應該犧牲代碼/可讀性較低的效率嗎？
效率損失將無法衡量，如果有的話。
編寫可讀性好的代碼總是更好。
最後你的第一個例子的文件大小更少，所以下載CSS更快。
我們應該犧牲效率來減少代碼/可讀性嗎？
是的！如果你想效率，compress your code，但始終有一個完全可讀，易於修改，清晰和到位的源版本。
，它通常最好有零內嵌樣式。如果它只是一個元素，給它一個ID，並把它的樣式放在你的CSS文件中。
我認爲壓縮代碼會導致較少的「效率」，因爲這意味着瀏覽器必須先進行更多的處理才能先解壓縮代碼。 – 2011-12-18 21:47:40
@druciferre我不確定瀏覽器是否解壓代碼 – ajax333221 2011-12-18 21:53:30
@druciferre，這取決於壓縮方法。一些人喜歡傳輸時間，另一些人喜歡解析時間。這兩者之間也有幫助。 – FakeRainBrigand 2011-12-18 21:53:53
在我看來，重寫CSS是CSS的一部分。
至於效率，我不認爲你會注意到兩者之間的可測量的差異（下載時間除外）。
什麼是重要的是要是一致的，並使您的代碼可讀。
至於你的榜樣，我會做：
border:none;
border-top:1px solid #ddd;
很簡單，因爲我覺得這使得它更具可讀性
我不知道這樣做的方式，它是有趣的 – ajax333221 2011-12-18 21:49:09
說實話，當談到CSS只是寫出你在想什麼「我想擺脫我的舊邊界，但然後我想要一個頂部邊框」，只是做到這一點......這是直到你意識到CSS需要噸嵌套的div來正確定位任何東西） – Tomas 2011-12-18 21:53:15
我想你問錯了問題。您提供的示例在下載時間或呈現頁面所需的時間之間不會產生太大差異。我認爲任何Web開發人員的主要焦點都應該放在讓代碼至少易於自己閱讀，最好是讓其他人閱讀。
我會做這樣的：
border-width: 1px 0 0 0;
border-style: solid; /* may not be necessary as many browsers use this as default */
border-top-color: #DDD;
它的短，不是很神祕，以顯示是什麼樣的，並沒有做任何多餘的。
我不知道短手可以應用於邊界寬度，我想這是真的，「我們都每天都學到東西」:) – ajax333221 2011-12-19 02:11:03
至於壓縮：不知道作者是什麼意思，但如果你縮小代碼，另一端的瀏覽器將不會「unminify」它來閱讀它，就像我們想要的那樣。空的空間無論如何都會被忽略，如果不存在，那可能甚至會加速解析...
好吧，要成爲CSS，效率並不是什麼大問題：下載CSS文件需要更多的時間（除非您使用Internet Explorer） – JCOC611 2011-12-18 21:41:29
您是否測量過任何性能差異？ – greg0ire 2011-12-18 21:42:18
@ greg0ire，我沒有，我不知道如何測試 – ajax333221 2011-12-18 21:45:47