自定義的CSS爲特定的WordPress的菜單項目

Question

我需要從自定義CSS下面的代碼更改li ul li的CSS，我已經爲他們寫了一個自定義類，並試圖通過WP-ADMIN分配它，但它是不合理的。

<li id="menu-item-10088" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children submenu hover"><a href="http://www.example.com/company/">Company</a> 
<ul class="sub-menu " style="display: block; overflow: hidden; height: 31.90023458481924px; padding-top: 0px; margin-top: 0px; padding-bottom: 0px; margin-bottom: 0px;"> 
    <li id="menu-item-10817" class="menu-item menu-item-type-custom menu-item-object-custom"><a href="http://www.example.com/company/">About Us</a></li> 
    <li id="menu-item-10818" class="aboutus menu-item menu-item-type-custom menu-item-object-custom"><a href="http://www.example.com/company/management-team/">Management Team</a></li> 
    <li id="menu-item-11137" class="aboutus menu-item menu-item-type-custom menu-item-object-custom"><a href="http://www.example.com/company/#company-2">Vision</a></li> 
    <li id="menu-item-10820" class="aboutus menu-item menu-item-type-custom menu-item-object-custom last-item"><a href="http://www.example.com/company/#company-3">Careers</a></li> 
</ul> 
<span class="menu-toggle"></span></li> 

我添加了自定義的類如下，並在相應的WP菜單項

#Header .sub-menu .aboutus li ul li { 
    font-weight: normal; 
    padding: 0; 
    position: relative; 
    width: 100%; 
    } 

提到它，但它沒有工作，我需要的是讓在上面的代碼中提到的菜單項的寬度作爲100％

Answer 1

<ul class="sub-menu " style="display: block; overflow: hidden; height: 31.90023458481924px; padding-top: 0px; margin-top: 0px; padding-bottom: 0px; margin-bottom: 0px;"> 
    <li id="menu-item-10817" class="menu-item menu-item-type-custom menu-item-object-custom"><a href="http://www.example.com/company/">About Us</a></li> 
    <li id="menu-item-10818" class="aboutus menu-item menu-item-type-custom menu-item-object-custom"><a href="http://www.example.com/company/management-team/">Management Team</a></li> 
    <li id="menu-item-11137" class="aboutus menu-item menu-item-type-custom menu-item-object-custom"><a href="http://www.example.com/company/#company-2">Vision</a></li> 
    <li id="menu-item-10820" class="aboutus menu-item menu-item-type-custom menu-item-object-custom last-item"><a href="http://www.example.com/company/#company-3">Careers</a></li> 
</ul> 

根據你的HTML，li是你的父母li，.sub-menu是你的ul和兒童li有.aboutus類，所以它應該有如下

#Header li .sub-menu li.aboutus { 
    font-weight: normal; 
    padding: 0; 
    position: relative; 
    width: 100%; 
    } 

即使下面的工作很好，因爲你需要不是指li如果sub-menu只會在嵌套li

#Header .sub-menu li.aboutus { 
     font-weight: normal; 
     padding: 0; 
     position: relative; 
     width: 100%; 
     }