Bootstrap - 如何定位特定的工具提示？

Question

所以在我的页面上我有几个工具提示，但我想每个人的颜色都不一样。我会如何去做这件事？我想通过一个复杂的CSS路线是可能的，但我希望更简洁的东西。

HTML

<div class="row redbg" data-toggle="tooltip" data-placement="right" title="Lorem ipsum dolor sit amet"></div>  
<div class="row bluebg" data-toggle="tooltip" data-placement="right" title="Lorem ipsum dolor sit amet"></div> 

的JavaScript

<script> 
    $(function() { 
    $('[data-toggle="tooltip"]').tooltip() 
}) 
    </script> 

CSS（只为此刻红）

/* TOOL TIP */ 
.tooltip-inner { 
    background-color: red; 
    color: #fff; 
} 

.tooltip.top .tooltip-arrow { 
    border-top-color: red; 
} 

.tooltip.right .tooltip-arrow { 
    border-right-color: red; 
} 

.tooltip.bottom .tooltip-arrow { 
    border-bottom-color: red; 
} 

.tooltip.left .tooltip-arrow { 
    border-left-color: red; 
} 
.tooltip-inner { 
    max-width: 350px; 
    /* If max-width does not work, try using width instead */ 
    width: 350px; 
    height:75px; 

所以竟被如何d我让类redbg的div显示红色工具提示，以及类bluebg的div如何显示蓝色工具提示？

感谢

Answer 1

.redbg + .tooltip > .tooltip-inner { 
    background-color: red; 
    color: #fff; 
} 

.bluebg + .tooltip > .tooltip-inner { 
    background-color: blue; 
    color: #fff; 
} 

我认为这是可以实现你在找什么。