Examples of highlighting and adding separators in the current menu of the wordpress navigation menu

Highlight the current menu in the wordpress navigation bar

The following is the built-in wordpress navigation highlight:

# Nav. current-menu-item, # nav. current-menu-parent {background: #000000 ;}

In the above code, # nav is the tag in the navigation menu. With the above CSS code, you can highlight the Accessed li tag in the # nav tag in the foreground.

How do I add separators in the navigation menu?

Effect: there are separators between menus. Do not display separators at the beginning or end of the entire menu.
You only need to use the following css code.

. Read_footer_menu li {float: left; font-size: 14px; line-height: 10px; margin-bottom: 15px; padding: 0 8px 0 8px; border-left: 1px solid #888888 ;}
. Read_footer_menu li: first-child {padding: 0 8px 0 0px; border-left: 0px solid #888888 ;}

First, add a left border for li in each menu and set the line height of li to less than the font height,
In the second sentence, use li: first-child to cancel the left border of the first menu.