Wordpress：徽标在小屏幕上的尺寸非常小

Question

我的徽标在屏幕上的大小是这样的

如果我更改浏览器的屏幕大小，那么我的徽标会变得非常小。

标志不能像前面的图片那样小。应该更像下一张图：

我知道有很多不同的主题，但是否可以通过缩小屏幕来保持徽标大？

Answer 1

我假设您使用的是主题并且不是从头开始构建的。您的主题很可能有响应式图像声明，例如：

.someAwesomeDivName img {
    width:100%;
    height:auto;
}

和持有该图像的父级 div 具有一定的宽度，这会影响其中的图像。先检查那里，然后从那里走。

Answer 2

大多数 WP 主题都有预设的媒体查询，这些媒体查询提供断点以使网站响应屏幕尺寸变化。

您可以使用自定义覆盖这些 CSS，但我会先找到断点。使用 this tool，然后将如下内容添加到您的 CSS:

@media screen and (max-width: 400px){
  .logo{
     width:200px !important;
 }
}

这会在屏幕尺寸为 400 像素或更小时更改徽标的宽度。将 400px 更改为断点设置的任何值。您可以通过这种方式编辑宽度或高度，但除非您愿意，否则无需同时进行。

编辑：上面 CSS 中的“.logo”应更改为徽标 class 中的任何内容。