说几个未知宽高元素水平垂直居中方法?
得分点:position、transform、flex、justify-content、align-items、vertical-align、text-align。
回答:
(1)设置元素相对父级定位。
让自身平移自身高度50%。
这种方式兼容性好,被广泛使用的一种方式。
(2)设置元素的父级为弹性盒子,设置父级和盒子内部子元素水平垂直都居中。
这种方式代码简洁,但是兼容性IE 11以上支持,由于目前IE版本都已经很高,很多网站现在也使用这种方式实现水平垂直居中。
(3)设置元素的父级为网格元素,设置父级和盒子内部子元素水平垂直都居中。
这种方式代码简洁,但是兼容性IE 10以上支持。
(4)设置元素的父级为表格元素,其内部元素水平垂直都居中。
这种方式兼容性较好。
加分回答:京东的移动端顶部京东logo,使用的就是display:flex;这种模式。
