Wie Änderungen anzuwenden Option „wählen Sie“ CSS

Question

Hier ist ein Beispiel, was es aussehen soll: Select box image

bekomme ich Ländernamen aus einer Datenbank und erzeugen dynamische Optionen auf Seite. Im Moment zeige ich den HTML-Code (nicht den Datenbankcode). Ich habe viele Links ausprobiert, um das Design (CSS) zu ändern, aber keiner von ihnen funktioniert mit "Auswählen". Ich möchte in der Lage sein, padding , border, background-color, color oder border-color zu ändern. Kann ich all diese Änderungen mit "css" oder "nicht auswählen" vornehmen?

Ich möchte auch nur die ersten 5 Optionen (die ersten 5 Ländernamen) in der Dropdown-Liste zeigen, wenn die Schaltfläche geklickt wird, mit einer scrollbar.

#country option:first-child { 
 
    display: none; 
 
} 
 

 
#country { 
 
    float: left; 
 
    width: 96%; 
 
    color: #fff; 
 
    font-size: 1em; 
 
    font-family: "Calibri"; 
 
    margin-left: 5px; 
 
    padding: 8px 0px; 
 
    margin-top: 16px; 
 
    border: 1px solid #00BCEA; 
 
    padding: 9px 5px; 
 
    width: 93%; 
 
    border-radius: 4px; 
 
    color: #00BCEA; 
 
}

<select id="country"> 
 
    <option value="selectOption">Select your country</option> 
 
    <option value="selectOption1">Select your country1</option> 
 
    <option value="selectOption2">Select your country2</option> 
 
    <option value="selectOption3">Select your country3</option> 
 
    <option value="selectOption4">Select your country4</option> 
 
    <option value="selectOption5">Select your country5</option> 
 
    <option value="selectOption6">Select your country6</option> 
 
    <option value="selectOption7">Select your country7</option> 
 
</select>

Answer 1

Sie können die folgenden Plugins versuchen. Dies wird Ihnen beim Styling Ihrer Auswahlbox helfen. Die Select-Plugins ordnen das select-Element dem HTML-Element <ul> zu und wenden die Stile darauf an. Wenn Sie das DOM untersuchen, ist das ausgewählte Element zwar sichtbar, aber nicht im Browser sichtbar.

• http://github.hubspot.com/select/docs/welcome/
• https://select2.github.io/

Hope this Sie

Dank helfen,