在Twitter中创建custom.css引导程序

Question

例如，在twitter引导中有一个类“下拉菜单”。 <ul class="dropdown-submenu">。 正如你所看到的那样，它有一个向右的箭头。如何在盘旋时将箭头的颜色设置为黑暗？

Answer 1

你可以做到这一点通过以下方式：

对于下拉菜单onHover选项颜色变化：符的

.navbar .nav li.dropdown > a:hover .caret, .navbar .nav li.dropdown > a:focus .caret { 
border-bottom-color: red;/*change color to your liking*/ 
border-top-color: red;/*change color to your liking*/ 
} 

改变颜色时有效（下拉菜单）：

.navbar .nav li.dropdown.open > .dropdown-toggle .caret, .navbar .nav li.dropdown.active > .dropdown-toggle .caret, .navbar .nav li.dropdown.open.active > .dropdown-toggle .caret { 
border-bottom-color: #008745;/*change color*/ 
border-top-color: #008745;/*change color*/ 
} 

For Dropdown子菜单

.dropdown-submenu > a:after { 
border-color: transparent transparent transparent #000000;/*change here */ 
border-style: solid; 
border-width: 5px 0 5px 5px; 
content: " "; 
display: block; 
float: right; 
height: 0; 
margin-right: -10px; 
margin-top: 5px; 
width: 0; 
} 

下拉子菜单onHover选项颜色变化：

.dropdown-submenu:hover > a:after{ 
     border-left-color:#fff; /* change the color to anything of your choice*/ 

    } 

符的默认颜色在这里设置并在下文提到的是可以改变的：

.caret { 
border-left: 4px solid transparent; 
border-right: 4px solid transparent; 
border-top: 4px solid #FFFFFF; /* change the color to anything of ur liking */ 
content: ""; 
display: inline-block; 
height: 0; 
vertical-align: top; 
width: 0; 
} 

Answer 2

只是切换的glyphicons形象？

.dropdown-submenu:hover{ 
    i{ 
    background-image: url("../images/bootstrap/glyphicons-halflings-white.png"); 
    } 

刚从google或glyphicons下载彩色图标图像文件或改变自己在Photoshop