jQuery UI wurde vor Bootstrap geladen, überschreibt aber immer noch Bootstrap-Stile? - CSS, Twitter-Bootstrap, JQuery-UI

Ich habe einige Tooltips auf meiner Seite, erstellt als:

<th rel="tooltip" data-toggle="tooltip" title="Text to show in tooltip">Change to date</th>

$("[data-toggle="tooltip"]").tooltip();

Dies sollte den klassischen schwarzen Bootstrap zeigenTooltip. Es zeigt jedoch einen anders aussehenden Tooltip. Wenn ich das Tooltip-Element untersuche, sehe ich, dass alle seine Stile von jquery-ui.css abgeleitet sind, aber dies sollte nicht der Fall sein, weil jQuery UI vor Bootstrap geladen wird:

<!-- jQuery UI -->
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">
<!-- Theme Styles -->
<link href="/valera/assets/css/bootstrap.css" rel="stylesheet">
<link href="/valera/assets/css/bootstrap-responsive.css" rel="stylesheet">

Jeder hat eine Idee, warum das so ist?

Antworten:

Das liegt daran, dass JQueryUI einige CSS-Selektoren hat, dieüberschreiben Sie die in Bootstrap. Sie müssen dies in Ihrem CSS überschreiben, um sicherzustellen, dass es die Regel in JQueryUI löscht. Wenn Sie weitere Hilfe benötigen, können Sie einen Link zu einer Geige oder einem Codepen hochladen.