有沒有正確的方式來佈局我的CSS？

Question

這是我的第一篇文章，所以如果我做錯了任何事情，請原諒我。我的問題是我應該如何佈局我的CSS文件？只是好奇，看看是否有一個「正確的方式」CSS應該寫。謝謝！

Answer 1

CSS應該按特異性進行佈局。

ID比比標籤更具體的類更具體。因此，您希望工作表頂部的一般標籤樣式以及類和ID。

p { }

.p { }

#p { }

還可以，優先事項，在大型項目中，單獨的CSS樣式爲不同的表，以方便其他人通過您的代碼閱讀。

CSS對空白不敏感，因此它的製表符不會使編譯更改，但是相應地進行標記當然是常見做法。

很多程序員都遵循很多其他規則，但大多數規則都是自以爲是的，所以您需要採取一種有效的方式來佈局CSS。即使我所說的規則不會「打破」你的CSS，如果不使用，但它們往往會幫助減少問題。進一步研究這個話題，並嘗試採用一套規則來遵循並保持一致。

Answer 2

你可以縮進你的css。或者在項目結束時將其最小化。 你可以使用大量的網站，可以幫助你做到這一點。

That's an example - CleanCSS

Answer 3

瞭解瀏覽器如何解析CSS和呈現網站是編寫更高效代碼的重要第一步。

關鍵選擇器有四種：ID，類，標籤和通用。它們的效率是相同的。

#main-navigation { }  /* ID (Fastest) */ 
body.home #page-wrap { } /* ID */ 
.main-navigation { }  /* Class */ 
ul li a.current { }  /* Class * 
ul { }     /* Tag */ 
ul li a { }    /* Tag */ 
* { }      /* Universal (Slowest) */ 
#content [title='home']  /* Universal */ 

您可以參考以下文章編寫更有效的CSS

Efficiently rendering css

Writing efficient css selectors