==》总结:
开始想使用line-height实现上述效果(设置父元素P的高度为26px和图标的高度一样大小,然后再使用line-height让文字垂直居中),但是发现没变化。(为什么这种方法不可以???)
而后改用vertical-align直接解决问题。
==》vertical的用法总结:参考资料:利用vertical-align:middle实现在整个页面居中
vertical-align的定义:vertical-align 属性设置元素的垂直对齐方式。该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中,这个属性会设置单元格框中的单元格内容的对齐方式。
假设在一个DIV中包含一个IMG元素,直接对IMG元素设置vertical-align:middle样式,发现毫无变化!!!
因为该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。所以其参考对象是跟它同一级的内嵌元素。