①邊框和內容之間的距離內邊距是padding，邊框的距離是border，margin外邊距，是兩個盒子之間的距離。
②盒子的實際寬度，高度=content+padding+border+margin
③其中的border屬性又可以分為：1.邊框寬度：border-width，可以自定義，也可以用thin細，medium中，thick粗來表示。2.邊框樣式border-style，可以用dashed橫線，dotted點，solid實線，double雙實線等等來表示。我們有時候在使用邊框來設定樣式可能只需要一條線，比如我們只需要下方有一條線的時候，可以書寫為border-bottom：width style color；這樣來設定這條線的各種屬性。
④：「*」作為樣式的名字，對瀏覽器的預設字型字型大小，邊距等多種屬性進行清零，如下：
⑤padding,margin屬性都可以設定成乙個固定的值，後面的單位是px，或者是設定成乙個百分比（參照物是外面的盒子）。
⑥一般乙個div標籤做出來的盒子會佔據一行，可以通過設定浮動與定位來改變盒子的擺放位置，以此來布置樣式。
⑦margin屬性垂直方向上的合併：當兩個盒子都有margin屬性的時候，瀏覽器會把它進行合併，哪乙個的margin值高則兩個盒子之間的垂直距離就是這個（水平方向不會這樣）。
⑧關於居中的設定：文字居中用text-align：center；其他的水平居中可以用：margin：0 auto；（上下自己設定，瀏覽器根據螢幕來自動設定水平居中的值）
⑧行內元素：a,img,input,span這樣的都是行內元素，內容決定寬高與其他行內元素從左到右的排列，設定無效。
⑨塊級元素：在標準流布局中佔據一行，如div是典型的塊級元素，可設定。
css盒子模型 css的盒子模型是什麼
css盒子模型就是在網頁設計中經常用到的css技術所使用的一種思維模型。css盒子模型又稱為框模型 box model 包含了元素內容 content 內邊距 padding 邊框 border 外邊距 margin 幾個要素組成了盒子模型。圖中最內部的框是元素的實際內容，也就是元素框，緊挨著元素框...
css 盒子模型 以及 box sizing屬性
在標準的盒子模型下，css中 width，padding以及border的關係 關於css中的width和padding以及border的關係。在css中，width和height指的是內容區域的寬度和高度，增加padding,border,和margin不會影響內容區域的尺寸，但是會增加元素框的總...
CSS 的盒子模型
今天學到了 盒子模型 的課程，終於快要解開我關於 width，padding，border margin 四者的疑惑了。弄清楚這四者關係的突破點必須先區分以下2個概念 內容和元素 因此乙個元素實際寬度 盒子的寬度 左外邊距 左邊框 左內邊距 內容寬度 右內邊距 右邊框 右外邊距 如圖所示 慕課網上把...