ul-li标签之间的标头中的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链接

获得了此信息

Answer 2

尝试将边框应用于

ul li {
display: inline-block;
border-right:1px solid #000;
}