Ändern Sie den Tooltip im Bootstrap 4

8

Ich versuche, einen Tooltip in Bootstrap 4 neu zu häuten / neu zu formatieren, und die ursprüngliche Art, es zu tun, scheint nicht mehr zu funktionieren. Momentan mache ich das:

%Vor%

.tooltip-inner funktioniert einwandfrei, aber .tooltip.top .tooltip-arrow nicht; es bleibt schwarz. Ich nehme an, .tooltip.top ist der Pfeil oben auf einer unten ausgerichteten QuickInfo.

Jede Hilfe wäre sehr willkommen

    
Takuhii 21.03.2016, 23:14
quelle

6 Antworten

8

Ab Bootstrap 4.0

CSS für die Tooltip -Umstrukturierung wird von der Klasse .tooltip-inner behandelt, wie Sie bemerkt haben:

%Vor%

CSS für den oberen Pfeil:

%Vor%

CSS für den rechten Pfeil:

%Vor%

Css für den unteren Pfeil:

%Vor%

CSS für den linken Pfeil:

%Vor%     
madison 29.08.2017, 13:52
quelle
5

Bootstrap 4 hat andere Klassen als 3 , Sie müssen Folgendes verwenden:

%Vor%

Diese Selektoren repräsentieren den Pfeil des top ausgerichteten Tooltips.

    
max 21.03.2016 23:33
quelle
2

Ich verwende bootstrap 4.0.0-beta.2. und dieser Code hat für mich funktioniert.

%Vor%     
kapil 08.11.2017 06:56
quelle
2

Wenn Sie SASS verwenden, überprüfen Sie tooltip.scss file:

GIT

Um die Farbe zu ändern, überschreiben Sie einfach diese Variablenwerte: $tooltip-arrow-color und $tooltip-bg .

    
marcelo2605 07.04.2017 10:30
quelle
1

Bootstrap v4.0.0-beta

data-toggle="tooltip" data-placement="right"

- Das funktioniert für mich.

%Vor%     
OctavioGT 24.08.2017 00:39
quelle
0

Bootstrap 4.0.0 & amp; Popper.js

Dies ist der minimale Code für den grünen Tooltipp auf der linken Seite:

%Vor%

Fügen Sie es einfach Ihrem CSS hinzu.

    
Alex Glinsky 09.02.2018 12:17
quelle

Tags und Links

Django: Verwenden von Annotate, Count und Distinct in einem Queryset Scala gibt keinen Fehler bei der Kompilierung, wenn einem Zahlenliteral ein Wert zugewiesen wird.