把網頁元素比如文字等等，放入盒子，然後利用css擺盒子的過程，就是網頁布局
屬性作用
值border-width
邊框粗細
畫素值border-style
邊框樣式
solid(實線)；dashed（虛線）；dotted(點線)
border-color
邊框顏色
red;blue等
連寫一般按照以下順序書寫：
border:width style color;
在border後加入方位就可以指定單邊的邊框樣式如：
例：
border-top:1px solid red;table,td使用margin定義塊元素的垂直外邊距是時，會出現外邊距合併
當上下相鄰的兩個塊元素 相遇時，如果上面的塊元素有margin-bottom, 下面的塊級元素有margin-top,它們的垂直間距不是margin-bottom+margin-top之和而是取它們中較大的值，這被稱為相鄰塊元素垂直外邊距合併（也稱外邊距塌陷）
對於兩個巢狀的塊級元素，如果父元素沒有上內邊距和邊框，則父元素的上邊距會與子元素的上邊距發生合併，合併後外邊距為兩元素中的較大者，即是父元素的上邊距為零也會發生合併
解決方法：
為父元素新增1px的上內邊距或上邊框
為父元素設定：overflow:hidden
外盒尺寸計算（元素空間尺寸）空間高度=height+padding+border+margin
空間寬度=widtht+padding+border+margin
內盒尺寸計算（元素實際大小）如果乙個盒子沒有指定寬度，就會沾滿父親的寬度，和父親一樣寬，這時padding 不會撐開盒子實際高度=height+padding+border
實際寬度=width+padding+border
盒子模型 筆記
images cssbase.css layout.css index.css 脫離文件流 寬度不夠會掉下來 行內元素支援寬高 塊元素會根據內容撐開寬高 文字環繞 用到浮動必須清浮動 不要用inline block，用浮動 相對定位 根據自己定位 不會脫離文件流 絕對定位 脫離文件流 根據父級定位 ...
盒子模型筆記
border 1px solid ccc 第乙個表示邊框粗細 第二個表示邊框線型 第三個表示邊框顏色 border width 邊框粗細 border style 邊框線型 border color 邊框顏色 負責兩個盒子之間的距離 margin 10px 上下左右都為10px margin top...
CSS筆記 盒子模型
一.盒子模型簡介 css將頁面中的所有元素都設定成了乙個矩形的盒子 將元素設定為矩形的盒子後，對頁面的布局就變成了將不同的盒子擺放到不同的位置 每乙個盒子都由以下幾個部分組成 內容區 content 內邊距 padding 邊框 border 外邊距 margin 二.內容區 content 使用w...