最近想趁著工作不忙的間隙，瘋狂的敲一段時間的前端代碼。我反思了一下為什么我無法快速寫好前端的一個原因，就是看的多，寫的少。前端的知識結構比較瑣碎凌亂。所以如果不大量的練習直到熟練，在具體的開發中是會遇到各種各樣的問題的，這也是導致很多人學前端一直遲遲無法做出作品的重要原因。 本身我有后端的基礎，前端的基礎知識點大部分我還是有比較深的印象的，這次寫代碼主要是加深下對常用知識點的理解深度。并且多做案例，多總結套路。最后形成自己對前端的知識結構。 如果后續有機會，我會以公開課的形式和大家進行探討交流。 今天主要記下border-box這個屬性的理解。 border-box是css3中新增的屬性，與之前的區別在于對于寬度的計算方式上有所區別： 以前block模塊的寬度計算方式為：width=內容的寬度。整個div的寬度計算有幾個 content+padding+border 那么box-sizing:border-box后，寬度的計算就發生了改變變成如下的方式： width=content 具體例子和說明大家可以參照下邊的這篇文章，說的還是好理解的 http://www.html-js.com/article/2511