css - ul-li 标签之间 header 中的 Html 边框分隔符

Question

看看我的问题:

现在我有:

我需要做什么:

我尝试处理边框，但没有任何反应。

这是我的代码:

<ul id="tabMenu">
<li class="dropdown"><div><a class="tab1"><div class="dropdown_text">поиск по производителю</div></a></div></li>
<li class="dropdown"><div><a class="tab2"><div class="dropdown_text">поиск по назначению</div></a></div></li>
<li class="dropdown"><div id="menu_logo"></div></li>
<li class="dropdown"><div><a class="tab3"><div class="dropdown_text">кабинет</div></a></div></li>
<li class="dropdown"><div><a class="tab5"><div class="dropdown_text">сравнение</div></a></div></li>
<li class="dropdown"><div>
<span id="more_search"></span><a class="tab4" href="/emarket/cart/"><div class="dropdown_text">покупки</div></a>
</div></li>
</ul>

这是 CSS:

ul li {
display: inline-block;
}

ul li a {
color: #ccc;
white-space: nowrap;
text-decoration: none;
padding-top: 55px;
}

ul li a div.dropdown_text {
display: inline-block;
}

div.site_info ul li a.tab1  (etc for a.tab2, a.tab3, a.tab4) {
float: left;
margin-left: 89px;
background: url(/img/new_desing/producers.png) no-repeat top center;
}

请帮我解决这个问题。

Answer 1

如果你想要它的阴影，那么将这个样式应用到你的 div

box-shadow: 0px -3px 5px #888888;

或者改变值直到你得到那个效果..

编辑

如果你想在你的div中获得阴影效果，那么使用

box-shadow: inset 0px -3px 5px #888888;

编辑

分隔符用这个

nav li + li:before{
content: " | ";
padding: 0 10px;
}

我通过 this 得到了这个链接