Question

我想将徽标放在导航菜单之间，但我无法弄清楚如何在我拥有的主题中执行此操作，因为我在后端找不到它。我确定这只是重新排序或为照片添加边距和空间的问题......在CSS的标题部分下面是代码：

#header { padding:0 20px;margin-bottom:8px;}

#logo { float:left; }

#logo { text-transform:capitalize; padding:35px 0; }    
#logo img { max-width:100%; }

#navigation { float:right; margin-right:20px; }

#navigation ul { list-style:none; position:relative; }
#navigation ul li { float:left; padding-left:30px; font-size:12px; display:block; position:relative; font-weight:bold; }    
#navigation ul li a { color:#888; padding-bottom:10px; padding-top:35px; display:block; }   
#navigation ul li ul { position:absolute; border:1px solid #e9e9e9; display:none; left:15px; padding-bottom:15px; z-index:9999; }   
#navigation ul li ul li {  min-width:150px; margin-left:15px; margin-right:15px; padding:15px 0 10px 0; border-bottom:1px solid #f6f6f6; font-weight:normal; font-size:10px; }  
#navigation ul li ul li:last-child {  border:0;  padding-bottom:0; }    
#navigation ul li ul li a { border:0; display:block; padding:0; }   
#navigation li:hover ul { display:block; }

#navigation select { display:none; -webkit-appearance: none; border-radius: 0; }

#navigation ul li#magic-line { position: absolute; left: 0; width: 100px; height: 4px; padding-left:0; display:none; }

Answer 1

我想你正在使用wordpress主题？如果是这样，每个li都有自己的类。因此，您应该创建一个“空”菜单，并将其添加为该链接的背景，您可以将链接设为主页。您可以使用text-indent隐藏的文本：-9999px;

如果你有确切的链接，我会更有帮助，请查看我如何将其拉出来：http://itsgoran.com/cider

更新

代码应该是这样的：

li#menu-item-15 {
    background-image: url(http://www.new.sheisbiddy.com/wp-content/uploads/2015/11/SHEISBIDDYmainlogoandslogan1.png);
    width: 470px;
    height: 130px;
    background-repeat: no-repeat;
    text-indent: -9999px;
}

但我建议首先创建较小的徽标图像，然后使用该图像，然后添加较小的宽度和高度，这将是较小图像的宽度/高度。

在菜单项之间放置徽标

1 个答案: