替換元素：
其中有類特殊的元素：如img，input，select，textarea，button，label等，他們被稱爲可替換元素（Replaced
element）。他們區別一般inline元素（相對而言，稱non-replaced
element）是：這些元素擁有內在尺寸(intrinsic
dimensions),他們可以設置width/height屬性，且他們中間沒有實質性的內容，也即在代碼中不會直接顯示（文本內容）。替換元素是瀏覽器根據其標籤的元素與屬性來判斷顯示具體的內容。替換元素可增加行框高度，但不影響line-height,內容區高度值 = padding-top + padding-bottom + margin-top + margin-bottom + height。要想替換元素居中，可以設置line-height = height， vertral-align = middle。
（vertical-align:middle,是將元素行內框的垂直中點與父元素基線上0.5ex處的一點對齊。）他們的性質同設置了display:inline-block的元素一致。意思就是這些所謂的可替換元素即內聯塊。
或許有朋友對非置換元素（non-replaced element）有點疑惑，稍微幫助大家理解一下。非置換元素，W3C 中沒有給出明確的定義，但我們從字面可以理解到，非置換元素對應着置換元素（replaced element），也就是說我們搞懂了置換元素的含義，就懂了非置換元素。置換元素，W3C中給出了定義：
“An element that is outside the scope of the CSS formatter, such as an image, embedded document, or applet”
從定義中我們可以理解到，置換元素（replaced element）主要是指 img, input, textarea, select, object 等這類默認就有 CSS 格式化外表範圍的元素。進而可知，非置換元素（non-replaced element）就是除了 img, input, textarea, select, object 等置換元素以外的元素。
替換元素：替換元素是瀏覽器根據其標籤的元素與屬性來判斷顯示具體的內容。
比如：<input /> type="text" 的是，這是一個文本輸入框，換一個其他的時候，瀏覽器顯示就不一樣。(X)HTML中的<img>、<input>、<textarea>、<select>、<object>都是替換元素，這些元素都沒有實際的內容。
替換元素可增加行框高度，但不影響line-height,內容區高度值 = padding-top + padding-bottom + margin-top + margin-bottom + height。
要想替換元素居中，可以設置line-height = height， vertral-align = middle。
（vertical-align:middle,是將元素行內框的垂直中點與父元素基線上0.5ex處的一點對齊。）
非替換元素：(X)HTML 的大多數元素是不可替換元素，他們將內容直接告訴瀏覽器，將其顯示出來。
比如<p>p的內容</p>、<label>label的內容</label>；瀏覽器將把這段內容直接顯示出來。
非替換元素添加padding-top或padding-bottom，不影響行框高度，但內容區高度會變化，margin-top，margin-bottom對行框沒有任何影響。添加左右邊距會影響非替換元素水平位置。要使非替換元素在父元素框內居中，可以設定line-height = 父元素框的高度。行內非替換元素上設置的內邊距不會影響行高計算；因此，如果一個元素既有內邊距又有背景，從視覺上看可能會延伸到其他行，有可能還會與其他內容重疊。