實際上網頁中的每乙個標籤都可以看成乙個盒子模型，而這個盒子模型從內到外有以下這幾個元素組成
並且margin,border,padding分別有上下左右4個值
如上圖所示，可以很容易的得出盒子的大小，也就是對應標籤真正大小。
所謂的寬高不是width和height,而是盒子的寬度和高度。
高度 = 內容高度 + 上下內邊距 + 上下邊框 + 上下外邊距
寬度 = 內容寬度 + 左右內邊距 + 左右邊框 + 左右外邊距
margin,border,padding三個屬性在設值的時候均可以對上下左右進行單獨設定：
margin-top: 100px;
margin-bottom: 100px;
margin-left: 50px;
margin-right: 50px;
/* 上 右 下 左*/
margin: 100px 100px 50px 50px;
/* 上下 左右*/
margin: 100px 50px;
/* 上 左右 下*/
margin: 100px 20px 50px;
/* 錯誤寫法 */
margin-left: 20px;
margin: 10px;
margin-left:20px失效。
在使用盒子模型進行布局的時候要格外注意的乙個問題是： margin塌陷。
*
div
.d1
.d2
肉色部分是chrome瀏覽器檢查div.d2屬性的margin邊距，很明顯它的top是30px,也就是說margin距離是距離上下左右容器border的距離，所以造成了div.d1的20px的margin-bottom塌陷在div.d2的margin-top裡了。
在計算盒子之間的距離時需要考慮margin，但margin也有乙個很好用的方法使塊劇中：
margin: 0 auto;border屬性的三要素：
一般設定border的樣式時一般使用簡寫方式：
border: 1px solid red;可以通過設定dispaly屬性將元素在行內和塊之間轉換，其引數包括：
標準文件流實際上是乙個不太好的翻譯，一開始不是很理解，查了一下發現，標準中說的是normal flow翻譯為普通流或者常規流更好。
當瀏覽器解析網頁的時候，遵循從上往下，從左到右的順序。
一旦元素脫離了標準文件流的時候，行內元素和塊元素的特性將消失。
標準文件流的常見現象：
空白摺疊現象。
高矮不齊，底邊對齊。
自動換行，一行寫不完，自動換行。
單詞沒寫完不換行。
float: left / right;脫離標準文件流，元素一旦脫離標準文件流(脫標)，後面的元素會佔據浮動元素原本的位置，而且元素就不再遵守文件流中塊級元素和行內元素的特性。
元素浮動會脫離文件流但是不會脫離文字流，所以會產生字圍效果。
相互貼靠。
浮動會帶來的影響：
html**：
.box ul li如何清除浮動帶來的影響：
1.首先可以通過為父元素設定高度來消除浮動：
.boxoverflow:hidden屬性清除浮動：
.boxclear:both屬性的空標籤：
C Primer之再續前緣
起因 昨天參加了藍港互娛的面試，在面試的過程中，被面試官點出自己在c 方面的基礎太過薄弱。自己回想這段時間的日程，花費在c 上的時間確實太過短暫。所以在這幾天找工作的經歷中頻頻摸襟見肘。過往的知識點遺忘的差不多了。而複習力度卻完全不夠。思之想之還是應該從頭再來。所以就有了這篇文章。結論 從今日起開始...
HTML CSS基礎小白知識概要
對不起，您的瀏覽器不支援 如果瀏覽器都不支援，就會出現p元素中的內容 有序列表type可填這些內容 i 為羅馬數字，a 為小寫字母，a 為大寫字母 無語義元素div 語義化容器 header 通常用於頁頭，也用於表示文章頭部 article 表示整篇文章 footer 表示頁尾,表示文章尾部 sec...
HTML CSS之段落排版
中文文字中的段前習慣空兩個文字的空白，這個特殊的樣式可以用下面 來實現 p，在head頭裡面寫上下面的 注意 2em的意思就是文字的2倍大小。text indent就是縮排的意思p 如果想在網頁排版中設定文字間隔或者字母間隔 就可以使用 letter spacing來實現 h1 如果我想設定英文單詞...