css中圖文混排基線對齊與vertical-align屬性設(shè)置

我們在設(shè)置圖文混排時，默認的情況是圖片頂對齊而文字底對齊，通過設(shè)置css屬性可以使得圖片與文字對齊，接下來為大家詳細介紹下設(shè)置各對象的vertical-align屬性，

設(shè)置各對象的vertical-align屬性，屬性說明：

baseline－將支持valign特性的對象的內(nèi)容與基線對齊
sub－垂直對齊文本的下標
super－垂直對齊文本的上標
top－將支持valign特性的對象的內(nèi)容與對象頂端對齊
text-top－將支持valign特性的對象的文本與對象頂端對齊
middle－將支持valign特性的對象的內(nèi)容與對象中部對齊
bottom－將支持valign特性的對象的文本與對象底端對齊
text-bottom－將支持valign特性的對象的文本與對象頂端對齊

在此設(shè)置為text-bottom即可實現(xiàn)圖片與文字位于同一水平線上，好看多了
如下：其他自己改

<span style="width:120px;"><img src="/images/New_16_blue.gif" style="vertical-align:text-bottom;"/>目標任務(wù)</span>