个性化阅读
专注于IT技术分析

WP标头导航栏太庞大

我正在这个网站上工作-http://galleriadesigns.co.uk/dev/

我的问题是导航栏过大。关于如何缩小尺寸, 同时保持相同布局的任何想法。

我尝试更改(top和z-index属性), 这只是将所有内容推高了, 看起来也不好。

我想要类似的内容-https://www.cxwebexperts.com/themes/adam/

这是我的CSS-

.intelligent-header {
transition: .3s;
position: fixed;
width: 100%;
z-index: 999;
transform: translateY(0%);
top: 0;
border-bottom: 1px solid #e5e5e5;

}

body.logged-in.admin-bar .intelligent-header { top: 32px; –}

谢谢。


#1


对于你的.logo类, 你的填充如下:padding:25px 0px;

:

.logo {
    padding: 8px 0;
    transition: .3s;
}

减小填充(顶部和底部, 即25像素到10像素;)


#2


如果你想知道为什么你的问题遭到拒绝, 请查看以下准则:如何创建最小, 完整和可验证的示例

当你想要实现与Adam主题演示类似的方面时, 你可能不希望裁剪徽标, 这会使菜单比演示网站大得多, 只需比较它们的大小即可:

  • 你的图片高60像素
  • 亚当的徽标高30像素

你可能不想尝试减少徽标的高度, 从而减少了初学者的顶部和底部页边距。

如果你想进一步修改主题的css, 则可以删除.logo类的填充, 或将其设置为0, 但这可能会导致其他设计笨重。


#3


根据你的网站链接, 我发现CSS有问题。我在这里发送CSS

.logo {padding:15px 0;} .logo .navbar-brand> img {width:55px; margin:0;} .header-middle-area#menu-primary-menu.main-menu.hover-style-one.clearfix {margin:0;}

赞(0)
未经允许不得转载:srcmini » WP标头导航栏太庞大

评论 抢沙发

评论前必须登录!