Schriftart tolles Symbol in der Option auswählen

8

Ich versuche, ein caret down icon zur ersten Auswahl mehrerer Optionen hinzuzufügen, wie in der folgenden Abbildung gezeigt:

Hier ist eine Geige mit meinem Beispiel: Ссылка

Ich kann das Symbol nicht auf der obigen Fiddle sehen.

Und der entsprechende Code:

%Vor% %Vor%
    
michltm 20.04.2016, 11:56
quelle

5 Antworten

2

Sie können i -Tag in option -Tag nicht hinzufügen, da Tags entfernt werden.

Aber Sie können es nach dem select so hinzufügen

    
Vincent G 20.04.2016, 12:02
quelle
24

Sie können einfach ein font-awesome-Icon zu Ihrer Auswahl hinzufügen (als Text!). Sie brauchen nur ein paar Dinge in CSS, das FontAwesome CSS und den Unicode. Zum Beispiel  :

%Vor% %Vor%

Arbeitsgeige:

Ссылка

Die Unicodes können gefunden werden, wenn Sie auf ein Icon klicken: Ссылка

  

Laut dem Kommentar unten und dem Problem auf Github funktioniert der Unicode in ausgewählten Elementen nicht auf OSX (noch).

Update : aus dem Github-Problem , hinzufügen Das multiple Attribut für select element sorgt dafür, dass es funktioniert:

OSX El Capitan 10.11.4

  • Chrome-Version 50.0.2661.75 (64-Bit)
  • Sarafi Version 9.1
  • Firefox Version 45.0.2

%Vor% %Vor%

JSFiddle

    
Jer 20.04.2016 12:10
quelle
15

Volles Beispiel und neuere Version: Ссылка

%Vor% %Vor%
    
Victor Grados 17.11.2016 18:34
quelle
1

Ich empfehle Ihnen, das Jquery-Plugin selectBoxIt selectBoxIt

zu verwenden

Es ist schön und einfach, und Sie können den Pfeil des Dropdown-Menüs ändern.

    
Ahmed Al Bermawy 20.04.2016 12:06
quelle
0

Wenn Sie das caret-down-Symbol verwenden möchten, entfernen Sie das "apparence: none", das bedeutet, dass Sie webkit und moz aus dem select in css entfernen wollen.

    
Sheetal Shetty 20.04.2016 12:06
quelle

Tags und Links