- inline-block不同写法的显示效果
- vertical
vertical-align属性必须作用于inline-block元素
设置line-height使其真正居中
- z-index、opacity
z-index(层级问题)
后来居上原则:正常情况下,元素没有设置z-index属性,出现位置比较靠后的元素层级更高。
定位局上原则:做了定位的比没有做定位的层级要高
大者居上原则:根据z-index数值大小来决定,如果一个父元素的z-index是高于另一个父元素的那么他的子元素也必然高于他们
(黑色半透明:称为“蒙版”,这里使用了fixed的固定定位方式,z-index设置大了一点;弹出框的z-index设置更大一点)
opacity意思是不透明,值为1是不透明,0为完全透明;opacity控制的是整个元素的透明度。里面的子元素也会跟着一起透明,所以蒙版中不适合用opacity,否则弹出框会变透明;但可以使用rgba的方法
- baseline
图片底部为baseline,默认情况下。容器内的图片和文字会按照baseline这条底线对齐,文字多大取决于容器的font-size,设置font-size:0,底部就贴合了。但这不是最好的方法,可以使用vertical-align:middle;