Navigation with ul and li

Problems:

We need a navigation on most of the web pages. We can use <ul> and <li> to set the items of the navigation. There are many navigation style. Here, I just give an example to show the navigation items horizontally with a vertical bar between like taobao navigation.

 

Solution:

        .navigation li {
            float: left;
            list-style: none outside none;
            padding:0 9px 0 9px;
            border-left: 1px solid #D0D0D0;
        }

        .navigation li.first{
            border-left: 0 none;
        }

        .navigation li a {
            text-decoration: none;
        }

 

Try it with jsfiddle