Ohne Verwendung von Plugins, wie kann ich die Höhe der <select> Box in CSS erhöhen? Ich versuchte line-height, aber es hat nicht für mich funktioniert.Wie style (erhöhen Sie die Höhe) der Auswahlbox in CSS?
Dank
Ich kam in dieses andere Antwort, die, wenn jemand die Chancen auf diese Frage wieder tatsächlich funktioniert.
How to standardize the height of a select box between Chrome and Firefox?
Grundsätzlich Sie das Aussehen Definition des Elements ändern, dann können Sie Stil, um es hinzuzufügen.
.className {
-webkit-appearance: menulist-button;
height: 50px;
}
Arbeitete für mich, aber es ändert die Grenze auf dem Element. Stellen Sie sicher, dass Sie nach der Änderung den Browser überprüfen, und stellen Sie sicher, dass das Rahmenstyling noch akzeptabel ist.
Für mich diesen den Trick:
select {
font: inherit;
}
Da die Priorität auf das Inline-Styling gegeben ist, können Sie diesen Trick verwenden, um die Höhe Ihrer Auswahlliste zu erhöhen. Alles was Sie tun müssen, ist Inline-Stil im Select-Tag hinzuzufügen.
<!-----------If you are using Bootstrap ---------->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<body>
<div class="container">
<form>
<div class="form-group">
<label for="sel1">Select list (select one):</label>
<select class="form-control" style=" height:50px;" id="sel1">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
</select>
</div>
</form>
</div>
</body>
Ich hoffe, das funktioniert für Sie
nur eine Höhe auf die Option in Ihrem Stylesheet, so dass Sie leicht die Höhe des Auswahlfeld mit der Anzahl der Option Zeilen berechnen
<style>select>option{height:20px;}</style>
und diese Funktion in Ihrem Skript-Tag hinzufügen, wie Sie es wünschen oder kopieren Sie einfach diesen
<script>function myFunction() {
var x = document.getElementById("mySelect").length;
var y = 20 * x +10;
document.getElementById("mySelect").style.height = y+"px";}</script>
Körperabschnitt
<body onload="myFunction()"><select id="mySelect" multiple="multiple"><option>Apple</option>option>Pear</option><option>Banana</option><option>Orange</option><option>Banana</option></select></body>
Gerade Höhe benutzen? Oder füge den "