關於img標籤間距問題：多個img之間有間距，包含img標籤的div之間有間距。
**如下：
1 doctype html>2 3
4
5
testtitle>
6
7 head>
8 9
10
11
12
13 div>
14
15
16
17
18 div>
19
20
21
22
23 div>
24 body>
25 html>
谷歌瀏覽器效果：
火狐瀏覽器效果：
我們發現，不同div之間，上下有空白間隙，不同img之間，左右有間隙，而且，不同瀏覽器的左右間隙大小不同。
經學習，我的解決辦法是，同乙個div下不同img標籤之間不要留空格，並給img的父元素div標籤加上屬性font-size:0。這樣一來，所有的就能夠無縫拼接了。
最終效果圖：
下面來說一下為什麼這樣做可以解決問題。
塊級元素包含內聯元素如文字等時，內聯元素預設是和父級元素的baseline（基線）對齊的，而baseline又和父級元素底邊有一定的距離（這個距離和font有關，不一定是5px），所以以上**的效果中不同div之間有間隙，這是因為與父元素的底邊有距離。說到baseline呢，其實它是vertical-align屬性的預設值，vertical-align屬性是設定元素的垂直排列的，用來定義行內元素的基線相對於該元素所在行的基線的垂直對齊，除了baseline對齊方式之外，還可以是sub | super | top | text-top | middle | bottom | text-bottom |inherit（任何的版本的internet explorer （包括 ie8）都不支援屬性值 "inherit"）。
知道了問題產生的原因，就好對症下藥解決問題了，其實就是要消除baseline對齊方式產生的距離。
所以方法一，很容易想到，把對齊方式改一下不就好了，於是設定img的vertical-align屬性為bottom；
方法二就是上文說的給父元素加上font-size:0的屬性，既然這個距離和font有關，那麼把字型大小設為0，總該沒有距離了吧；
方法三可由方法二想到，既然為0可以，那把行高設的很小可不可以呢？經試驗發現，本例大小為200px，設line-height不大於12就能夠消除間隙了，鑑於這個距離一般是5px，所以可以把line-height設為5px左右；
另外乙個間隙是多個img標籤的左右間隙，是由於img標籤是行內元素，而事實是當行內元素之間有「回車」、「tab」、「空格」時就會出現間隙。
所以方法就是上文提到的，去掉img標籤之間所有的空格，如果又不想把所有連續的行內元素寫到一行，可以多行注釋，把空格回車什麼的注釋掉，就像下圖這樣；當連續的行內元素不是img時，也可以通過設定父元素的font-size為0來消除左右間隙。
IMG標籤的間距問題
問題 包含img標籤的div之間有間距 垂直方向上有間距 在這裡插入描述 原因 塊級元素包含內聯元素如文字等時，內聯元素預設是和父級元素的baseline 基線 對齊的，而baseline又和父級元素底邊有一定的距離 這個距離和 font 有關，不一定是5px 所以與父元素的底邊有距離。解決方法 1...
解決多個img標籤之間出現間距問題
作為開發人員，我們在日常開發工作中經常會遇到由多個組成的頁面。雖然元素之間的填充值設定為零，但我們仍然可以看到兩張之間會有乙個難看的間隙，無法無縫拼接。因此，簡單的檢查就可以看出，造成這種現象的原因是img是乙個內聯元素，而內聯元素的特點是 行布局 這意味著內聯元素的預設對齊方式是與其父基線對齊，但...
解決img標籤自帶外邊距問題
三種方法去除img標籤自帶外邊距。目錄 頁面效果 圖1 img的高度是100px 圖2 父容器div的高度卻是104px 第乙個div中包裹img標籤，img標籤的高度設定為100px，但是第乙個div的高度卻是104px。上面圖1中可以看到兩個div之間出現了一條 白邊 這個邊距並不是我們設定的，...