css處理網頁時，它認為每個元素都包含在乙個不可見的盒子裡。乙個盒子我們會分成幾個部分：• 為什麼要想象成盒子呢？因為如果把所有的元素都想象成盒子，那麼我們對網頁的布局就相當於是擺放盒子。
• 我們只需要將相應的盒子擺放到網頁中相應的位置即可完成網頁的布局。
內容區指的是盒子中放置內容的區域，也就是元素中的文字內容，子元素都是存在於內容區中的。
顧名思義，內邊距指的就是元素內容區與邊框以內的空間。
• padding:10px 20px 30px 分別指定上、左右、下四個方向的內邊距外邊距是元素邊框與周圍元素相距的空間， 使用margin屬性可以設定外邊距。用法和padding類似，同樣也提供了四個方向的margin-top/right/bottom/left。• padding:10px 20px 分別指定上下、左右四個方向的內邊距
• padding:10px; – 同時指定上左右下四個方向的內邊距
• 同時在css中還提供了padding-top、padding-right、padding- right、padding-bottom分別用來指定四個方向的內邊距。
當將左右外邊距設定為auto時，瀏覽器會將左右外邊距設定為相等，所以這行**
margin:0 auto可以使元素居中。
內邊距會影響盒子的可見框的大小，元素的背景會延伸到內邊距, 盒子的大小由內容區、內邊距和邊框共同決定。因此：
盒子可見框的寬度
=border-left-width + padding-left + width + padding-right + border-right-width
盒子可見寬的高度
=border-top-width + padding-top + height + padding-bottom + border-bottom-width
HTML css盒子模型
盒子模型 盒子屬性 1.border style邊框模式 border top style上部 border bottom style下部 border left style左 border right style右 2.border width邊框畫素 border top width上部 bor...
HTML CSS盒子模型
本篇文章 本文講述了css盒子模型的一些基本關鍵字。lang en charset utf 8 盒子模型title p,div pdiv style head 熱愛生命 我不去想是否能夠成功 既然選擇了遠方 便只顧風雨兼程 我不去想能否贏得愛情 既然鍾情於玫瑰 就勇敢地吐露真誠 我不去想身後會不會襲...
html CSS的盒子模型
css的盒子模型1 邊框 border 上 border top 下 border bottom 左 border left 右 border right 內補丁 paddings 內邊距 上 padding top 下 padding bottom 左 padding left 右 padding...