1、使用img產生間隔問題

img屬於行級塊級元素（標籤）其屬性display的值為inline-block,因有inline元素，故有文字屬性，如果換行使用多個img標籤來顯示圖片的時候，因換行帶來的空格（空格是文字的空格符）使得每個圖片產生間隔，要消除間隔，則應該使得img標籤之間沒有換行或者空格

2.body產生的margin

body標籤本身具備有8px 的margin，故一般編寫css的時候使用*{margin：0；}初始化

3盒子模型的要點

盒子模型分為：標準盒子模型（寬高計算不包含border），IE盒子模型（寬高計算包含border） 盒子的三大部分：盒子壁（border）+內邊距（padding）+盒子內容（content） 盒子模型：三大部分+邊界（margin） 盒子計算其高度（height）一般不包含margin

padding的取值個數問題： 四個值：上，右，下，左 三個值：上，左右，下 兩個值：上下，左右 一個值：四個方向的值一樣

4、塊級元素居中

利用 position：absolute left：50% top：50% 再加上margin（一般根據塊的大小進行）

z-index即代表z軸，靠近人的視角，一般是解決元素之間的層疊

5.margin塌陷

垂直父子元素的margin-top的值一般取父子兩者大的值（margin塌陷） 解決方法：將父級變成bfc( block format context) 要觸發盒子的bfc可以使用：position：absolute display :inline-block float :left/right overflow:hidden

6.float產生的浮動流

具有父級的元素，因使用float使得父級的框架不起作用（支撐不起父級的框架）即產生了浮動流，使得塊級元素不可見，僅有bfc、文字、或帶有文字屬性的元素可見 解決方案：1、在產生浮動流後加p標籤並且使用clear:both 2、使用偽元素：：before、：：after等使用clear

clear要起作用則必須為塊級元素：display：block

注意凡是設定了position:absolute,float:right/left這些元素會變成display:inline-block(行級塊級元素）

7.文字圍繞圖片

使用float標籤可使得文字圍繞圖片

8、文字居中

容器高等於文字高則文字居中顯示如 height:30px, line-height:30px

9、文字溢位容器要打點展示

1、單行文字: 文字失去換行 white-space：nowrap 溢位部分隱藏 overflow：hidden 溢位部分用點點 text-overflow：ellipsis 2、多行文字：截斷處理overflow：hidden

10、當網速不夠刷不出圖如何用文字描述

當網速不好的時候,瀏覽器會遮蔽掉css這時候一些圖片就不會顯示，這時候就要用文字表達 方法1、text-indent:首行縮排 white-space：nowrap文字失去換行 overflow：hidden 方法2、width設定為0但是height不為0 padding-top： overflow：hidden

11、巢狀問題

行級元素可以巢狀行級，塊級元素可以巢狀任何元素，但是p元素列外 p元素不可以巢狀塊級元素 a元素不可以再巢狀a元素

12、要使得頁面的邊框隨著螢幕的大小改變 ，而內容不變

只要設定margin:0 auto;