Question

我想将链接颜色更改为红色并在li上添加边距。问题是它保持在wordpress上的默认设置。

我试过：

#menu-menu-raiq a{color:red;}
#menu-menu-raiq li{margin:5px;}

但没有任何效果。我也试过上课。

a{color:red;background-color:blue;}

工作，但它适用于所有页面。

<div class="off-canvas-wrapper-inner" data-off-canvas-wrapper>
    <div class="off-canvas position-right" id="off-canvas" data-off-canvas data-position="right">
        <ul id="menu-menu-raiq" class="vertical menu" data-accordion-menu><li id="menu-item-169" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-169"><a href="http://dev.wdp.raiq.ca/a-propos/">À propos</a></li>
            <li id="menu-item-129" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-129"><a href="http://dev.wdp.raiq.ca/activites/">Activités</a></li>
            <li id="menu-item-130" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-130"><a href="http://dev.wdp.raiq.ca/formations/">Formations</a></li>
            <li id="menu-item-126" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-126"><a href="http://dev.wdp.raiq.ca/ressources/">Ressources</a></li>
            <li id="menu-item-128" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-128"><a href="http://dev.wdp.raiq.ca/membres/">Membres</a></li>
            <li id="menu-item-125" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-125"><a href="http://dev.wdp.raiq.ca/contact/">Contact</a></li>
        </ul>
    </div>
</div>

Answer 1

这应该这样做：

#main-menu-raiq li.menu-item {
  margin:5px !important;
}

#main-menu-raiq li.menu-item a {
  color:red !important;
  background-color:blue !important;
}

Answer 2

如果您想确保应用特定样式，可以使用CSS中的!important修饰符为它们提供更高的特异性值。

因此，如果您想定位<li>元素下的<a>和main-menu-raiq元素，可以使用以下内容：

/* Explicitly add 5px of left margin to <li> elements beneath your main menu */
#main-menu-raiq li { 
    margin-left: 5px!important; 
}
/* Likewise, explicitly target any <a> elements beneath your menu and make them red/blue */
#main-menu-raiq a { 
    color: red!important; 
    background: blue!important; 
}

在CSS选择器上设置颜色。儿童和父母不兼容

2 个答案: