CSS深入理解之vertical-align

2018-01-26 10:29:28来源:网络收集作者:程序诗人人点击

分享

[var1]

慕课学习-->前端开发-->HTML/CSS-->CSS深入理解之vertical-align


Vertical-align
一、vertical-align基本认识

vertical-align支持的属性值及组成:除了inherit(继承)外,还包括4类:


1、线类:baseline(默认值,基线对齐),top,middle,bottom


2、文本类:text-top,text-bottom


3、上标下标类:sub,super


4、数值百分比类:20px,2em,20%,......(支持负值)


值为数值的行为表现机制:在baseline对齐的基础上上下偏移对应数值大小。


值为百分比时,是相对于line-height计算的!(IE6/IE7下vertical-align百分比值不支持小数line-height)


支持负值的属性:margin,letter-spacing,word-spacing,vertical-align


二、vertical-align起作用的前提

各种display值对vertical-align的影响


1、Vertical-align起作用是有前提条件的,vertical-align应用于inline水平以及‘table-cell’元素。


Inline水平:


Inline:,,,,未知元素,......


Inline-block:(IE8+),

最新文章

123

最新摄影

微信扫一扫

第七城市微信公众平台