Html 如何在页面上居中放置3个水平排列的图像？

我有一个非常简单的HTML/CSS网页

我在页面上水平排列了三幅图像，如下所示：

我想把它们放在页面的中心，就像这样：

有什么办法

以下是我当前使用的（不工作）代码：

。草图{
对齐内容：居中对齐；
}
img{
边界半径：50%；
边框：1px实心#000000；
}

---

解决方案如下：

.outer{
显示：表格；
位置：绝对位置；
身高：100%；
宽度：100%；
}
.中{
显示：表格单元格；
垂直对齐：中间对齐；
}
.草图{
对齐内容：居中对齐；
左边距：自动；
右边距：自动；
}
img{
边界半径：50%；
边框：1px实心#000000；
}

因为默认情况下

是块元素且

CSS

a）

草图

选择器

---

1） 插入

显示：flex声明


2） 代替CSS属性：
align content
add
justify content


。草图{
显示器：flex；
证明内容：中心；
/*可以删除*/
最小宽度：350px；
}
img{
边界半径：50%；
边框：1px实心#000000；
}