html - h1 标题旁边的小图片

Question

我有一个非常简单的问题，但我无法全神贯注。至少对于一个优雅的解决方案。

我想在页面居中的标题右侧显示一张图片。

<h1>My title</h1><img src="smallicon.png"/>

所以“我的标题”应该在页面的中间，图标在它的右边。 如果我在标题上设置 float: left 那么它的右边就有图标，但当然现在不再居中了。

Answer 1

一个非常简单的方法是使用 flexbox(当你有一个标题周围有类“header”的容器时):

.header {
  display: flex;
  justify-content: center;
}