如何让我的子菜单项显示在移动设备上？

如何解决如何让我的子菜单项显示在移动设备上？

菜单和子菜单可以全屏显示，但不能在移动设备上显示。下面是我到目前为止尝试过的 CSS 和 html。如果这有所作为，它就是一个 wordpress 网站。

@media (max-width:767px){
.main-navigation .menu-item .menu-item-type-post_type .menu-item-object-page{
width: 100% !important; 
}
.menu-item-has-children{
display: block !important;
}
}

<nav id="site-navigation" class="main-navigation menu-navigation pull-right" role="navigation" aria-label="Primary Navigation">
                <div class="menu-primary-container"><ul id="primary-menu" class="menu"><li id="menu-item-110" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-29 current_page_item menu-item-110"><a href="https://ceptech.net/" aria-current="page">Home</a></li>
<li id="menu-item-111" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-111"><a href="https://ceptech.net/Metal-stampings/">Metal Stampings</a><span class="arrow-icon" aria-hidden="true"><svg class="svg-icon th-fill-current" width="24" height="24" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></span>
<ul class="sub-menu">
    <li id="menu-item-3077" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3077"><a href="https://ceptech.net/automotive-solutions-custom-progressive-die-stamping/">Automotive Solutions with Custom Progressive Die Stamping</a></li>
</ul>
</li>
<li id="menu-item-2682" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-2682"><a href="#">Services</a><span class="arrow-icon" aria-hidden="true"><svg class="svg-icon th-fill-current" width="24" height="24" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></span>
<ul class="sub-menu">
    <li id="menu-item-2678" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2678"><a href="https://ceptech.net/rapid-prototyping-services-for-custom-progressive-stamping/">Rapid Prototyping</a></li>
    <li id="menu-item-2679" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2679"><a href="https://ceptech.net/custom-emi-shields-with-progressive-die-stamping/">Custom EMI Shields</a></li>
    <li id="menu-item-2680" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2680"><a href="https://ceptech.net/custom-progressive-die-stamping-for-battery-contacts/">Custom Progressive Die Stamping</a></li>
</ul>
</li>
<li id="menu-item-120" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-120"><a href="https://ceptech.net/ignition-terminals/">Ignition Terminals</a></li>
<li id="menu-item-121" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-121"><a href="https://ceptech.net/quality/">Quality</a></li>
<li id="menu-item-1227" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-1227"><a href="https://ceptech.net/resources/">Resources</a><span class="arrow-icon" aria-hidden="true"><svg class="svg-icon th-fill-current" width="24" height="24" aria-hidden="true" role="img" focusable="false" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><polyline points="6 9 12 15 18 9"></polyline></svg></span>
<ul class="sub-menu">
    <li id="menu-item-1334" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1334"><a href="https://ceptech.net/understanding-emi-rfi-shielding-to-manage-interference/">Understanding EMI/RFI Shielding to Manage Interference</a></li>
    <li id="menu-item-2631" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2631"><a href="https://ceptech.net/resources/technical-cleanliness-whitepaper/">Technical Cleanliness Whitepaper</a></li>
    <li id="menu-item-2632" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2632"><a href="https://cta-redirect.hubspot.com/cta/redirect/3326211/d75ea3b0-b634-4128-93e9-28b9141ae82e?__hstc=35332478.777e0e801851d2e93e2dddfa7014abbb.1608043617309.1610659249312.1610985022841.6&#038;__hssc=35332478.2.1610985022841&#038;__hsfp=2873996859">Custom Sample Kit</a></li>
    <li id="menu-item-3073" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3073"><a href="https://ceptech.net/video-gallery/">Videos</a></li>
    <li id="menu-item-2633" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-2633"><a href="https://cta-service-cms2.hubspot.com/ctas/v2/public/cs/c/?cta_guid=7ecbd783-3cae-4410-b260-1fed9926f2ee&#038;signature=AAH58kG1E22KyghqiNlaJvIwllG8HwKgkw&#038;placement_guid=63a8f1d7-3c6e-4017-92dd-251867db8895&#038;click=893497ab-753d-4250-91d8-5817aefe276a&#038;hsutk=777e0e801851d2e93e2dddfa7014abbb&#038;canon=https%3A%2F%2Fceptech.net%2Fresources%2F&#038;utm_referrer=https%3A%2F%2Fceptech.net%2F&#038;portal_id=3326211&#038;redirect_url=APefjpHG5CfFarm8Gne-3eP6vIme_HNa3KqjdiD1BdfbkmfM18sTHJLexl0dnykdjYtssM8isjXR-zbR4fyUeQ8W8kOpBcRWYLHjghRUMifZTKu1gqCYc762M1ewMtK6aUlFp5IaNxlnWiRxcAA-KUEGhFohqsiko8iPj_y7BpjSS8GTcGHnhW_Ciblng1OHgA2Ahxt_OKVkLZHwOj7_H1tk8lbFa_aufMRLAn1_YmxHDcnFJD0ZiGxFoGGP8KXhthWwlZL8y7mtrBVXfIOCSQNuWpjSNc5Pji_9CV8aVt-xUyXgGleygW0U5wWrFXyWXWkdXvxNkwhyCom-GQf8OfrycBjkylrKGQ&#038;__hstc=35332478.777e0e801851d2e93e2dddfa7014abbb.1608043617309.1610659249312.1610985022841.6&#038;__hssc=35332478.2.1610985022841&#038;__hsfp=2873996859&#038;contentType=standard-page">Catalog</a></li>
    <li id="menu-item-2635" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2635"><a href="https://ceptech.net/resources/25-progressive-Metal-stamping-terms/">Glossary</a></li>
    <li id="menu-item-2636" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-2636"><a href="https://ceptech.net/resources/case-studies/">Case Studies</a></li>
    <li id="menu-item-1335" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-1335"><a href="https://ceptech.net/resources/">All Resources</a></li>
</ul>
</li>
<li id="menu-item-123" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-123"><a href="https://ceptech.net/contact-us/">Contact Us</a></li>
<li id="menu-item-742" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-742"><a href="https://ceptech.net/blog/">Blog</a></li>
</ul></div>         </nav>

解决方法

您在 css 中的类之前缺少点，它应该是这样的：

.main-navigation .menu-item .menu-item-type-post_type .menu-item-object-page .menu-item-has-children