如何在使用 css 时使标题图像居中？答案

【问题标题】：how to make header image at center in using css?如何在使用 css 时使标题图像居中？
【发布时间】：2018-11-25 01:11:58
【问题描述】：

您能否告诉我如何在使用 css 时在中心制作徽标。实际上我正在使用 media 查询 mobile 视图。在桌面上我的 html 工作正常，但在移动视图中我想在中心显示 logo 并并排有两个 menu 选项（见下图）。

这是我的代码

@media screen and (max-width: 480px) and (min-width:320px) {
    .header{
        background: #00B7FF;
        flex-direction: column;

    }
}

【问题讨论】：

【解决方案1】：

假设您想垂直居中，添加 margin: auto; 应该可以在弹性列布局中解决问题。

【讨论】：

【解决方案2】：

您可以将容器宽度设置为 100%。

@media screen and (max-width: 480px) {
  .container {
     width: 100%;
  }
}

然后将标题居中对齐。

@media screen and (max-width: 480px) {
  .header{
     text-align: center;
  }
}

你可以看例子here。

【讨论】：