以下是一种解决方法,使用flex布局,并添加了代码示例:
Flex Item 1
Flex Item 2
Flex Item 3
Flex Item 4
在上面的示例中,.container
是一个flex容器,.item
是flex项。通过设置justify-content: center
和align-items: center
,可以将flex项在容器中水平和垂直居中。同时,设置flex: 1
可以让所有的flex项平均分配剩余空间,不会影响居中效果。