css垂直水平居中的几种方式

1.absolute+transform的方式

• 子元素设置  position: absolute;
                      left: 50%;

                       top: 50%;

                       transform: translate(-50%,-50%);（不定宽高）
• 子元素设置 position: absolute;
                    top: 0;

                      left: 0;

                      right: 0;

                       bottom: 0;

                        margin: auto;（子元素需要定宽高）
• 父元素设置   display: flex; justify-content: center; align-items: center;