How to style a WordPress navigation menu bar using CSS

Writing styles for navigation menus nowadays is mostly a routine job; after all, CSS has made strides in the last few years, we can even mimic hover-intent on menus without any JavaScript at all (a topic which we’ll cover on a dedicated tutorial). WordPress isn’t much different, the native menu functionality is powerful and versatile enough to give us with exactly the HTML we’d require, plus a few more options for providing a better user experience to our users. The aim of this post is to take you through those and provide a complete solution on how to style a native WordPress navigation menu.
Adding a WordPress menu to our website
Displaying a nav menu on your WordPress site is generally very simple, it only takes a couple of lines:
<?php
// functions.php
register_nav_menus( array(
‘main’ => __( ‘Main Menu’, ‘mytheme’ ),
) );
?>

<?php // somewhere in header.php ?>
<header class="header">
<nav class="nav">
<?php
if ( has_nav_menu( ‘main’ ) ) {
wp_nav_menu( array(
‘theme_location’ => ‘main-menu’,
‘container’ => ”,
‘menu_class’ => ‘navigation-main’,
Source: https://managewp.org/articles/16696/how-to-style-a-wordpress-navigation-menu-bar-using-css

source https://williechiu40.wordpress.com/2017/11/24/how-to-style-a-wordpress-navigation-menu-bar-using-css/