How to change the background color for top tab menu bar in Blogger (blogspot)

Once you add a tab menu bar at the top of your blog by using static Pages, you will get one more tab at the top bar each time you publish a Page. Then how to set/ add / change the background color for the top tab menu bar, like on this site, give it a green background color, or any other color?

It's easy. You just need to add one line codes to your blog template.

Here's how

1. From the blog Dashboard, go to Template -> Edit HTML-> Proceed -> put a check mark in front of the the "Expand Widget Templates" option (details: same as the first 3 steps in this post)

2. On your keyboard press the "Ctrl" and "F" keys at same time to bring up the search box.

3. In the search box  you type in (or copy) this highlighted codes .tabs-inner { to search, in the template window you will see the mouse cursor come up to some code similar to following screenshot:

4.  Add following one line code above } symbol:

background-color:#6baa4a;

Note:

#6baa4a is the color code for the green color I'm using. You can replace it with any other color code you want. If you have no idea of the color code, you can search "HTML color" in Google.

Once added, it will looks like following screen:

5. Make sure to save the change by clicking on "Save Template" button at the top-right corner. Done !

Go back to your blog and refresh your webpage, you will see your favorite background color showing up for your top tab menu bar !

It's Your Turn

What's your experience of creating the menu tabs? How do you customize the tab? Is there any other menu tab solution? Share your experience and insights in the comments box below.