2014-01-12 5 views
1

Я использую bootstrap 2.3.2, и я делаю его подменю для открытия с левого сайта, и я помещаю значок стрелки подменю в левую сторону, но я не знаю, как изменить значок правой стрелки на левый.Как изменить значок выпадающего меню bootstap-submenu?

Update

Это li тег, который содержит детей:

<li class="dropdown"> 
    <a href="#" class="dropdown-toggle" data-toggle="dropdown">Parent1 <b class="caret"> 
    </b></a> 
    <ul class="dropdown-menu"> 
     <li class="dropdown-submenu"><a href="#" tabindex="-1">Sub-Parent1</a> 
      <ul class="dropdown-menu"> 
       <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child1</a></li> 
       <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Chiled2</a></li> 
       <li class="divider"></li> 
       <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child3</a></li> 
       <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Child4</a></li> 
      </ul> 
     </li> 
     <li class="dropdown-submenu"><a href="#" tabindex="-1">Sub-Parent2</a> 
      <ul class="dropdown-menu"> 
       <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child1</a></li> 
       <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Child2</a></li> 
       <li class="divider"></li> 
       <li><a href="#"><i class="fa fa-plus"></i>&nbsp;Child3</a></li> 
       <li><a href="~/User"><i class="fa fa-list"></i>&nbsp;Child4</a></li> 
      </ul> 
     </li> 
    </ul> 
</li> 

Я делаю Чайлдс, чтобы открыть слева сайта с установкой float:left в bootstrao.css и положить значок стрелки в левом я сделал то же самое, и теперь мне просто нужно изменить сам значок.

+0

Пожалуйста, покажите свой код – Sachin

ответ

3

Это он:

.dropdown-submenu > a:after { 
    display: block; 
    float: left; 
    width: 0; 
    height: 0; 
    margin-top: 5px; 
    margin-right: -10px; 
    border-color: transparent; 
    border-right-color: #cccccc; 
    border-style: solid; 
    border-width: 5px 5px 5px 0; 
    content: " "; 
} 
2

вам нужно посмотреть класс под названием dropdown-submenu>a:after. это то, что использует bootstrap для создания стрелки. это кажется очень ужасным способом сделать это со мной, он использует границы и т. д.

display: block; 
float: right; 
width: 0; 
height: 0; 
margin-top: 5px; 
margin-right: -10px; 
border-color: transparent; 
border-left-color: #ccc; 
border-style: solid; 
border-width: 5px 0 5px 5px; 
content: " "; 

вы должны принять этот CSS, отменить его, а затем добавить его в свой собственный CSS в dropdown-submenu>a:before

+0

Спасибо вашей для вашей помощи. Я сделал это с вашим советом.) –

+0

Спасибо! Это действительно запутывает, как они устанавливают эти стрелы. Я хочу, чтобы он менял направление, и это кажется запутанным. – Mutant

Смежные вопросы