面试--css实现元素水平和垂直居中
时间：2023-03-30 19:20:55
CSS
对于单行文本，使用line-height.wrap{width:200px;height:200px;background:yellow;}.wrapspan{line-height:200px;text-align:center;}sasas
对于已知高度的块级元素relative+absolute+margin-top:-height/2+margin-left:-width:-width/2对于行内块元素实现居中。wrap{宽度：200px；高度：200px；背景：黄色；}.wrapimg{vertical-align:middle;text-align:center;}.wrap.block{高度：100%；宽度：0；}
vertical-align:vertical属性是为兄弟级元素设置的.Block也是父元素和子元素高度未知时可以使用img:after或:before代替定位+transform.wrap{width:200px;height:400px;background:yellow;position:relative;}.wrapdiv{位置：绝对；上：50%；左：50%；变换：平移（-50%，-50%）；背景：红色；}
父元素和子元素的高度未知下父级：文本对齐：居中+表格布局子级：垂直对齐：中间+表格布局.wrap{宽度：200px；高度：400px；背景：黄色；显示：表格；文本对齐：居中；}.wrapdiv{显示：表格单元格；垂直对齐：中间；}
