我們平時在寫行內元素時，經常會不小心換行寫個空格啥的，然後就會驚奇的發現瀏覽器中居然有空格。
<span>第一個span標籤</span>
<span>第二個span標籤</span>效果是這樣的：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標題文檔</title>
<style type="text/css">
span {
padding:0px;
margin:0px;
background:#0f0;
}
</style>
</head>
<body>
<span>第一個span</span><span>這是第二個span</span>
<hr />
<em>第一個em標籤haha</em> <span>第二個span</span>
<hr />
<em>第一個em標籤</em> <em>第二個em</em>
<hr>
<span>第一個span標籤</span>
<span>第二個span標籤</span>
<br /><br />
<a>第一個a標籤</a><a>這是第二個a標籤</a>
<hr />
<a>第一個a標籤haha</a> <a>第二個標籤</a>
<hr />
<label>第一個label標籤</label> <label>第二個label</label>
<hr>
<label>第一個label標籤</label>
<strong>第二個strong標籤</strong>
</body>
</html>
效果是這樣的：
由此我們可以得出這樣的結論：只要是在兩個行內元素之間添加空格，或者換行在瀏覽器中的表現都會是一個空格的距離。
這個空格的距離具體是多大呢？它是當前字體大小的一半。
空格寬度 = 當前字體大小/2
例如默認字體大小是16px,那麼空格的寬度就是8px。有興趣的朋友可以去測量一下，但是這裏要注意一個問題——測量的時候別忘了算上中文後面的1px（甚至是幾px）的空白。關於這個問題我又在前一篇文章中詳細介紹，請移步下面鏈接↓
所有博客已轉移至個人博客地址：www.clramw.top