Margin與Padding的差別

寫CSS過程中，最常用到的，除了color跟width之外，就是margin以及padding了，剛接觸CSS，應該很難理解這2者的差異。這裡就來分享一下簡單的觀念吧！

基本
以一個div來說，margin就是指這個div「對外」的距離，相對的，padding則是指這個div「對內」的距離！
也就是說，當出現2個以上的div（或是其他容器，例如：p、span、ul等）的時候，藉由設置margin，則可以讓這2個div按照數值保持一定的距離！

而在div裡面通常會有各種內容存在，文字或是圖片，甚至是影片，如果希望這些元素與div容器中間能有些距離，這時候在div設置padding是最好的方法！

換個方式，假設對每個內容元素設置margin，以達到對外面這個div容器保持一定距離的目標，也是可以，只是，只要每增加一個內容，你就必須多寫一個margin語法，增加CSS複雜度，事後管理以及修改也增加不少困難度喔！再者，網站交到客戶手裡之後，客戶會上什麼資料？會有幾筆？這些我們很難去控制，要是發生排版問題，反而顯得不專業了！


如果能靈活運用margin跟padding，是相當重要的一環，CSS設計上將會更加完善！