弹性盒子怎么设置居中

弹性盒子布局（Flexbox）是一种用于创建灵活、响应式容器和元素布局的现代CSS技术。要使一个元素在Flexbox容器中水平和垂直居中，你可以使用以下方法：

1. **基本居中**:
如果容器的子元素只有一个，且没有其他复杂的对齐需求，你可以直接应用`justify-content: center;`和`align-items: center;`到`.container`选择器上：

   .container {
     display: flex;
     justify-content: center;
     align-items: center;
   }

2. **绝对定位**:
对于需要在内容区居中的情况，你可以先将元素设置为`position: relative;`，然后使用绝对定位来放置元素：

   .container {
     position: relative;
   }
   .centered-item {
     position: absolute;
     top: 50%;
     left: 50%;
     transform: translate(-50%, -50%);
   }

这里`.centered-item`将会在容器内部居中。

3. **`flex` 属性**:
如果你想用更现代的方法，可以直接设置`align-self`属性，对于单个元素：

   .centered-item {
     align-self: center;
   }

相关问题：
1. 如何在Flexbox容器中实现多个子元素的水平居中？
2. 如何处理Flexbox容器高度不确定时的垂直居中？
3. Flexbox的`align-content`属性和居中有什么关系？