Using CSS to change menu bkg & font colors

  • Author
    Posts
  • #1129815

    walterwalker
    Member

    I am considering changing the header image on The Fundraising Coach blog at http://eddiethompson.org. To make what I have in mind work, I need to use CSS coding to change the color of the menu bar to gray and the font to black. I assume this would change the drop down menus as well.

    What code would I paste into the CSS editor to accomplish this?

    The blog I need help with is eddiethompson.org.

    #1130092

    You’ll probably also want to change the hover color for menu items. Here is a set of CSS you can start with that contains all of the color-related rules for the main menu in the Twenty Ten theme:

    #access {
    	background: #999;
    }
    #access a {
    	color: #000;
    }
    #access ul ul {
    	box-shadow: 0px 3px 3px rgba(0,0,0,0.5);
    	-moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.5);
    	-webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.5);
    }
    #access ul ul a {
    	background: #999;
    }
    #access li:hover > a,
    #access ul ul :hover > a {
    	background: #333;
    	color: #fff;
    }
    #access ul li.current_page_item > a,
    #access ul li.current_page_ancestor > a,
    #access ul li.current-menu-ancestor > a,
    #access ul li.current-menu-item > a,
    #access ul li.current-menu-parent > a {
    	color: #fff;
    }
    * html #access ul li.current_page_item a,
    * html #access ul li.current_page_ancestor a,
    * html #access ul li.current-menu-ancestor a,
    * html #access ul li.current-menu-item a,
    * html #access ul li.current-menu-parent a,
    * html #access ul li a:hover {
    	color: #fff;
    }

    Replace the color codes with colors of your choice.

The topic ‘Using CSS to change menu bkg & font colors’ is closed to new replies.