1. z-index使用前提:
元素的position属性为:relative,absolute,fixed三个中的一个时,才起作用。
2. vertical-align 使用:
(1)必须声明HTML为HTML5。即在HTML文件头部添加 <!DOCTYPE html>
(2) vertical-align属性和line-height有着密切的关系。
行内元素的对齐,需要一个参考系,这个参考系就是行框的基线(默认是行内元素基线与行框基线对齐vartical-align= baseline),而行框的基线依据于行内框元素的基线位置。即行框的基线的位置是其直接包裹的文本X(非元素包裹)的最底部的位置,并且文本的中心和包裹其的行框垂直中线始终重合;因此行高确定后,行框的基线位置也就确定了。每个行内元素的字体的大小和line-height都会影响自身框的大小和自身行内框基线的位置,从而可能影响到行框的基线位置。例如:将某个行内元素的line-height或字体增大,使其行内框大于所有其他同一行中的行内元素,此时行框会被撑大。行框的基线会重新定位基线(即基线下移)。从而导致所有行内元素下移。
如果有图片在行内的话,那么图片的底端会对齐文本的基线,如果图片的大于所有行内元素,图片默认会在行框基线的基础上撑开行框。如果图片的vertical-align=top,则图片以行框顶部为基础撑开行框。