ブートストラップツールチップのフォントを変更する方法

Question

bootstrap.jsに組み込まれているツールチッププラグインを使用して、ツールチップ内のテキストが書き込まれるフォントを変更するにはどうすればよいですか？どんなに頑張っても、私のセレクターで定義されたテキストを変更するだけで成功しました。 。ツールチップは、次の本画像に表示されている$(".myTooltip").tooltip({html: "true", placement: "auto-right", delay: {"show": 300, "hide": 100}});
： - .tooltip-innerの.tooltip

<img title="<ul class='text-left'><li>Some text</li><li><em>More Text</em></li><li>Cost</li></ul>" class="myTooltip" src="image.png" />

Answer 1

ブートストラップは、2つのクラスを介してツールチップを飾る私のブートストラップは、これを使用してjQueryを使って活性化されますここでbootstrap.cssからの断片です：だから

.tooltip { 
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif; 
    font-size: 12px; 
    font-style: normal; 
    font-weight: normal; 
    line-height: 1.42857143; 
    text-align: left; 
    text-align: start; 
    text-decoration: none; 
    text-shadow: none; 
    text-transform: none; 
    letter-spacing: normal; 
    word-break: normal; 
    word-spacing: normal; 
    word-wrap: normal; 
    white-space: normal; 
    /* ... */ 
} 
.tooltip-inner { 
    max-width: 200px; 
    padding: 3px 8px; 
    color: #fff; 
    text-align: center; 
    background-color: #000; 
    border-radius: 4px; 
} 

することができます自分でセットアップツールチップ：

$(document).ready(function() { 
 
    $(".myTooltip").tooltip({ 
 
    html: "true", 
 
    placement: "auto-right", 
 
    delay: {"show": 300, "hide": 100} 
 
    }); 
 
})

@import url('https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css'); 
 

 
body { 
 
    padding: 20px; 
 
} 
 
.tooltip { 
 
    font-family: Georgia; 
 
    font-size: 20px; 
 
} 
 
.tooltip .tooltip-inner { 
 
    background-color: #ffc; 
 
    color: #c00; 
 
    min-width: 250px; 
 
}

<img title="<ul class='text-left'><li>Some text</li><li><em>More Text</em></li><li>Cost</li></ul>" class="myTooltip" src="http://glebkema.ru/images/2015_09_20_iphone_155_x400.jpg" /> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 

 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script>