1.盒子模型
margin(外邊距)- 清除邊框外的區域，外邊距是透明的。
border(邊框)- 圍繞在內邊距和內容外的邊框。
padding(內邊距)- 清除內容周圍的區域，內邊距是透明的。
content(內容)- 盒子的內容，顯示文字和影象。
最終元素的總寬度計算公式是這樣的：
總元素的寬度=寬度+左填充+右填充+左邊框+右邊框+左邊距+右邊距
元素的總高度最終計算公式是這樣的：
總元素的高度=高度+頂部填充+底部填充+上邊框+下邊框+上邊距+下邊距
2.定位
static 定位
html元素的預設值，即沒有定位，元素出現在正常的流中。
靜態定位的元素不會受到top, bottom, left, right影響。
fixed 定位
元素的位置相對於瀏覽器視窗是固定位置。
即使視窗是滾動的它也不會移動
relative 定位
相對定位元素的定位是相對其正常位置。
absolute 定位
absolutely定位使元素的位置與文件流無關，因此不佔據空間。
absolutely定位的元素和其他元素重疊。
3.浮動
float浮動
浮動之後脫離原本的文件流
clear清楚浮動
CSS 盒子模型 定位流 浮動
目錄 css盒子模型 1 內容得寬度和高度 2 元素的寬度和高度 3 元素空間得寬度和高度 css定位流 了解 相對定位 了解 相對定位的應用 絕對定位 了解 固定定位 靜態定位 浮動與清除浮動 了解 一 標準流中的兩種排版方式 1 垂直排版 2 水平排版 浮動 浮動流排版方式 特點 什麼是浮動元素...
css樣式之 浮動 盒子模型 定位
1.塊級元素 1.1 常用的塊級元素 div p h1 h6 ul ol li hr table 1.2 塊級元素的特點 1.2.1 塊級元素預設顯示在父標籤的左上角。1.2.2 塊級元素預設沾滿一行 沾滿整個文件流 1.2.3 塊級元素可以變為行內元素 display inline 變為行內元素 ...
CSS浮動 盒子模型
因為div都是獨自佔一行,如果想要幾個div佔一行就要使用浮動。one two three 頁面展示 紅色框向右浮動 乙個頁面的寬度最長是1350px如果第三個浮動框 每個浮動框是500px 放不下會自動浮動到下一行如果第乙個浮動框高度比第二個浮動框高度要大,就會出現下圖的情況。清除浮動 如果想要浮...