CSS水平垂直居中(最常见的三种方案flex、grid、absolute)

top和left属性都设置为50%。这会将.content元素的左上角定位到其父元素（.container）的中心。transform: translate(-50%, -50%);被应用到.content元素上。这会将.content元素自身向左和向上移动其自身宽度和高度的50%，从而使得.content元素的中心与其父元素的中心对齐，实现了居中。