Wie entferne ich den Pfeil im Dropdown in Bootstrap 4?

Ich benutze Bootstrap 4. Ich habe versucht, den Pfeil im Dropdown zu entfernen.Wie entferne ich den Pfeil im Dropdown in Bootstrap 4?

Die answers, die ich für Bootstrap 3 gefunden habe, funktionieren nicht mehr.

Die Datei ist here.

<div class="dropdown open"> 
    <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> 
    Dropdown 
    </button> 
    <div class="dropdown-menu" aria-labelledby="dropdownMenu1"> 
    <a class="dropdown-item" href="#">Action</a> 
    <a class="dropdown-item" href="#">Another action</a> 
    </div> 
</div>

Quelle

2016-07-25 Hongbo Miao

Mit CSS können Sie genau das tun:

.dropdown-toggle::after { 
    display:none 
}

Quelle

2016-07-25 20:11:31 Clyff

musste ich auch enthalten '! Important' diese benutzerdefinierte CSS erhalten zu übernehmen. –

Oh, fand ich die Art und Weise:

.dropdown-toggle::after { 
    content: none; 
}

Quelle

2016-07-25 20:11:23

Sie dies tun können ..

.dropdown-toggle::after { 
    display: none; 
}

Quelle

2016-07-25 20:11:44 ZimSystem

danke auch, sowohl Ihre und Clyffs Arbeit. –

Wenn Sie den Pfeil durch ein anderes Symbol ersetzen möchten (z. B. FontAweso me) Sie würden brauchen nur die Grenze auf dem Pseudo-Element von .dropdown-Toggle

.dropdown-toggle::after { border: none; }

Quelle

2017-04-07 16:27:41

Entfernen Sie einfach "Drop-Down-Toggle" Klasse von dem Element zu entfernen. Die Drop-Down wird immer noch funktionieren, wenn Sie die Daten-Toggle-Attribut als

<button role="button" type="button" class="btn" data-toggle="dropdown"> 
    Dropdown Without Arrow 
</button>

zwingende .dropdown-Toggle-Klasse Stile folgt wirkt sich auf alle Dropdown-Listen und Sie können auf den Pfeil in anderen Tasten halten wollen, ist das, warum das sieht mir die einfachste Lösung.

Quelle

2017-06-15 21:44:27 iko

Aus irgendeinem Grund funktionierten die anderen Lösungen nicht für mich. Ich betreibe Bootstrap 4. Das war das einzige, was funktionierte. –

Das funktionierte nicht ganz für mich. Die rechte Seite des Buttons ist nicht mehr gerundet. –

ich in meinem Projekt der akzeptierte Antwort für eine ganze Weile mit, aber gerade jetzt über ein gestolpert variable used by bootstrap:

$enable-caret: true !default;

Wenn Sie diese auf false dann wird das Caret jede Gewohnheit zu tun, ohne entfernt werden Code.

Mein Projekt war Ruby/Rails, also habe ich die verwendet. Ich änderte die Variable, indem ich eine custom-variables.scss importierte, wobei die obige Variable in meiner application.scssBEFORE die bootstrap.scss Datei/Dateien auf falsch gesetzt wurde.

Quelle

2017-12-10 01:45:10 bensmithbwd

entfernen Sie die „Dropdown-Toggle“ Klasse

Quelle

2018-02-01 11:34:09

Das ist eher wie ein Kommentar – mrun

Wie entferne ich den Pfeil im Dropdown in Bootstrap 4?

Antwort

Verwandte Themen