我开始研究小项目并且很难设置没有类别的子菜单以具有相同的样式。见图像:
我试图修改CSS类:
span.menu-style
但似乎没有效果。问题是当某个类别为空时,其中一个元素都是正常的。如何使所有标题具有相同的风格(粗体和大写),不依赖于是否有某些类别?
要在实际网站上查看问题,请点击here
然后导航:所有部门> Apple配件并向下滚动到受影响的类别。感谢
答案 0 :(得分:1)
编辑
.dropdown-menu > li:not(.dropdown-submenu) .menu-title {
font-size: 16px;
text-transform: uppercase;
font-weight: 700;
}
答案 1 :(得分:1)
你可以做两件事。您可以定位作为列表元素a
的子级的所有锚点li
不拥有类.dropdown-submenu
,或者您可以定位特定菜单通过添加到锚点a
父列表项li
的类的项目。
您正在使用的WordPress主题是将.dropdown-submenu
类添加到具有子菜单的所有列表项li
,如果它没有,则省略它。 iPod&电视配件没有任何菜单项,所以它没有上课。因此,我们需要定位这些锚点并添加相同的样式,这些样式针对具有类a
的父列表项li
的锚点.dropdown-submenu
。我们使用CSS pesudo class :not()
执行此操作。但首先,这里是CSS选择器生成我们需要复制的样式:
.wrapper_vertical_menu .vertical-megamenu > li.revo-mega-menu > .dropdown-menu > li.dropdown-submenu > a {
margin-bottom: 5px;
padding: 0 0 10px;
font-size: 16px;
color: #222;
text-transform: uppercase;
font-weight: 700;
}
现在复制所有属性并将属性修改为以下内容:
.dropdown-menu > li:not( .dropdown-submenu ) > a {
margin-bottom: 5px;
padding: 0 0 10px;
font-size: 16px;
color: #222;
text-transform: uppercase;
font-weight: 700;
}
确保将此覆盖应用于主题CSS文件以外的其他位置,因为将来可能会在更新时覆盖它,并且您必须重做它。
菜单项 iPod&电视配件已将类.menu-ipod-tv-accessories
应用于其列表项li
。
.dropdown-menu > li.menu-ipod-tv-accessories > a {
margin-bottom: 5px;
padding: 0 0 10px;
font-size: 16px;
color: #222;
text-transform: uppercase;
font-weight: 700;
}
然后,如果你有更多它可能看起来像这样:
.dropdown-menu > li.menu-ipod-tv-accessories > a,
.dropdown-menu > li.menu-universal-accessories > a,
.dropdown-menu > li.menu-apple-watch-accessories > a {
margin-bottom: 5px;
padding: 0 0 10px;
font-size: 16px;
color: #222;
text-transform: uppercase;
font-weight: 700;
}
答案 2 :(得分:0)
标题的样式:
.menu-title{
font-size: 16px;
color: #222;
text-transform: uppercase;
font-weight: 700;
font-family: 'LoraItalic';
}
答案 3 :(得分:-1)
要将相同的样式应用于多个不同的类/元素,可以将所需的选择器添加到css文件中,即
li a, .class_of_your_choice, #id_of_your_choice, ... {
/* css style that needs to be applied to every selector above */
}