You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

WordPress站点The Company主题导航菜单字体大小与粗细修改求助

How to Make Top Main Navigation Menu Items Larger & Bolder in The Company Theme

Alright, let's get your WordPress site (www.thepowerwithin.org.uk) sorted out—you want those top main menu items bigger and bolder using The Company theme, right? Here's exactly how to do it with CSS:

First, we’ll target the specific elements for your theme’s top-level navigation. The Company theme typically uses standard navigation classes, so this CSS should work right out the gate:

/* Enlarge and bold top-level main navigation links */
.main-navigation .menu > li > a {
    font-size: 18px; /* Tweak this number to adjust size—try 20px for even bigger */
    font-weight: 700; /* 700 is bold; use 800 for extra-heavy, 600 for semi-bold */
}

Quick breakdown of the code:

  • Font Size: 18px is a solid starting point, but feel free to bump it up or down based on your preference.
  • Font Weight: 700 is standard bold—most web fonts support this weight, but if your theme uses a custom font, check if it supports higher values like 800 for a thicker look.
  • Selector Specificity: The .menu > li > a part ensures we only target the top-level menu links, not any dropdown submenu items. That way you don’t accidentally mess up nested menus.

How to add this CSS to your site:

  • Head to your WordPress Dashboard → Appearance → Customize.
  • Scroll to the bottom of the sidebar and click Additional CSS.
  • Paste the code above into the text box—you’ll see a live preview of the changes right away!
  • Once you’re happy with how it looks, hit Publish to save.

If the code doesn’t take effect immediately, you might need to use your browser’s developer tools to find the exact selector for your menu:

  • Right-click on any top menu item and select Inspect.
  • In the dev tools panel, look for the <a> tag inside the menu’s <li> element. It’ll have a class like .nav-link or something theme-specific.
  • Update the CSS selector to match what you see. For example, if the link has a class .company-main-nav-link, your code would be:
    .company-main-nav-link {
        font-size: 18px;
        font-weight: 700;
    }
    

内容的提问来源于stack exchange,提问作者Brandon Morris

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.05.25 03:45:09