不符合編碼規範是新人最大的通病
建議閱讀一下騰訊前端團隊AlloyTeam的編碼規範，裏面規定了一些寫前端的規範，這個非常適合一個團隊來執行這套規範，保證代碼的可讀性、可維護等。這些規範就可以有效避免很多新手的常見通病。
一、胡亂命名
類名使用小寫字母，以中劃線分隔，id採用駝峯式命名，這是規範裏面的要求，很多新手由於開發項目寫的少，培訓視頻看得多，很多前端學習視頻質量比較低，div、id都是隨便寫，class="div1",id="test1"等等之類的，不是不可以，但是不專業，如果是做大項目非常喫虧。
二、很少寫註釋以及css結構混亂
很多新手用的編輯器都很有問題，不知道如何快速註釋，也沒有寫註釋的習慣，CSS也是看到哪裏和設計稿不同或者網頁呈現的樣式不好，就改到哪裏，沒有對CSS整個文件結構有一個完整的規劃，沒有規劃沒有章法，當然不會覺得有寫註釋的必要性了。甚至還出現一個css文件裏，樣式重複覆蓋嚴重等情況。
三、屬性沒有章法
存在空規則，屬性衝突，沒有用Tab排版難看，屬性順序紊亂可讀性差
不瞭解CSS的模塊化以及可複用
核心在於不知道如何組織CSS，由於之前沒有做過大型項目的經驗，所以不會感覺到CSS模塊化的必要性，對OOCSS,SMACSS等CSS設計模式所知甚少，比如沒有做過類似於以下CSS的模塊化過：Base (基本)、Layout（佈局）、Module (模塊)、State (狀態)、Theme (皮膚)，當你沒有模塊化的經驗，就不會深刻理解CSS的編程的必要性。
不瞭解CSS的性能優化
比如前面所說的屬性紊亂，樣式重複只是其中之一，還有過渡使用子選擇器、id選擇器和類選擇器限制性混亂等等，尤其是佈局和定位的問題。
知識點缺失
由於很多人學CSS學的都是w3cshool裏面的知識（w3cschool裏面的知識過於簡單），好像他們也能把網頁做得比較漂亮，但是由於不瞭解響應式設計、media、柵格化等諸多知識，對CSS的研究還停留在表面，寫的網頁問題也比較多。甚至很多人對CSS3的知識都沒有掌握。
要想避免出現這些問題，一是去閱讀規範，二是去了解CSS設計模式，三是去研究CSS性能，四是去研究Bootstrap等UI框架，五是應該去學一套前端框架Vue或者React，這樣大致就可以提升CSS的層次了。
我目前是在職前端開發，如果你現在也想學習前端開發技術，在入門學習前端的過程當中有遇見任何關於學習方法，學習路線，學習效率等方面的問題，你都可以申請加入我的前端學習交流3000人裙：前面：851 中間：231 最後：348。裏面聚集了一些正在自學前端的初學者裙文件裏面也有我做前端技術這段時間整理的一些前端學習手冊，前端面試題，前端開發工具，PDF文檔書籍教程，需要的話都可以自行來獲取下載。
————————～～～～
綜合提高CSS能力的方法：
一、找幾個商業級別的設計稿自己拆解重構，比如去一些知名的設計網站去下載ps文檔或sketch原稿，把它們用代碼復現，而且適配多終端；
二、去Github看幾個有代表性的項目，可以從one single page開始；
三、解讀經典UI框架源代碼，瞭解背後的設計理念；
四、使用開發者工具“抄襲”分解知名網站的前端網頁，多去了解商業級別作品的代碼經驗；
五、學習Webpack打包，至少了解Vue，有些網頁是用三大框架寫的，掌握打包器非常有必要；
六、閱讀前端規範瞭解團隊協作背景下的工程化；
七、瞭解CSS預處理器；
八、去MDN把css的屬性整理一下，比如僞類、僞元素，很多人只看了一些書籍、視頻教程、或者w3cschool，完全是不夠用的，技術文檔遠比教程教材重要，學任何編程都要把技術文檔放在第一位。