前段時間在做一個界面的時候遇到一個問題邮丰，給一個長寬都是100%的頁面DIV設置了border之后，這個DIV的長寬竟然超出了100%镊辕，這是怎么回事呢耿眉？這對于精通CSS的老大們來說不算問題，可是對于剛入行的我來說就顯得有些木訥，于是找了很多資料了解之后才解決這種問題竖瘾，這里分享一下沟突，告誡自己不斷學習的重要性。
先看問題准浴，這是我單獨把這一問題的代碼拿出來做的對比（原諒我一屏幕的 “原諒色”）：
從以上三張圖可以很清楚的知道事扭，要給DIV設置border之后默認情況下邊界的寬度會在DIV的基礎上再增加，所以想讓border的寬度計算在DIV之內(nèi)乐横，至于要添加一句CSS屬性box-sizing: border-box;求橄，就可以解決這種問題了。
如果你只是想解決這一問題葡公，那么以上的內(nèi)容就可以了罐农，如果想搞清楚這個CSS實現(xiàn)的原理，建議好好學習一下CSS3的Box model;即盒模型催什，我也是看了這個之后才明白盒模型的具體的一些原理涵亏，這里推薦w3cplus的一篇文章Box Sizing，講述的很詳細蒲凶。
學會一門語言容易气筋，精通一門語言卻需要很長時間的積累，就像javaScript旋圆，學完c++學的js,簡直半天就感覺自己都會了宠默，可是真正寫了一段時間才發(fā)現(xiàn)自己的自以為是，javascript也是一門需要深入學習才能明白的語言灵巧，原來我以為的以為并不是我以為的以為搀矫，謹記。
