Вертикальные разделители в горизонтальном меню UL

я пытаюсь создать горизонтальную панель навигации (без выпадающего списка, просто горизонтальный список), но яЯ не могу найти лучший способ добавить вертикальные разделители между пунктами меню.

Фактический HTML выглядит следующим образом:


 Item 1
 Item 2
 Item 3
 Item 4
 Item 5

Текущий CSS выглядит следующим образом:

.menu li {
display: inline;
margin-left: 25px;
padding-left: 25px;
}

Между каждым пунктом меню я хочу маленькое изображение в качестве вертикального разделителя, за исключением того, что я нене хочу, чтобы перед первым элементом отображался разделитель, а я нене нужен разделитель, показанный после второго элемента.

Конечный результат должен выглядеть примерно так:

Элемент 1 | Элемент 2 | Пункт 3 | Элемент 4 | Пункт 5

Просто заменяю трубу реальным изображением.

я пробовал разные способы - ямы пытались установитьlist-style-image собственность, но изображение нене показывай Я'Мы также попытались установить разделитель в качестве фона, который на самом деле работал более или менее, за исключением того, что у первого элемента был разделитель перед ним.

Ответы на вопрос(8)

Ваш ответ на вопрос