Jak zmienić rozmiar czcionki listy (nie widok początkowy)
Ustawiłem niestandardową czcionkę i tło dla początkowego widoku listy rozwijanej (Wybierz wybór). Thefont-size
ma 20 pikseli i wygląda świetnie z niestandardową czcionką. Jednak po kliknięciu na liście same opcje nie używają niestandardowej czcionki i wyglądają normalnie, z wyjątkiem czcionkifont-size
, który wydaje się przenosić. Tak wygląda w przypadku Chrome (testowałem także Safari i Firefox).
<code>@font-face { font-family: 'Averia Libre'; font-style: normal; font-weight: 400; src: local('Averia Libre Regular'), local('AveriaLibre-Regular'), url('http://themes.googleusercontent.com/static/fonts/averialibre/v1/rYVgHZZQICWnhjguGsBspHhCUOGz7vYGh680lGh-uXM.woff') format('woff'); } select { font-size: 20px; font-family: 'Averia Libre', cursive; background: url(http://www.greenriverworks.com/elements/borders/green_button_background_over.jpg) repeat-x; width: 400px; font-family: 'Averia Libre'; }</code>
<code><link href='http://fonts.googleapis.com/css?family=Averia+Libre' rel='stylesheet' type='text/css'> <select> <option value="">I'm a custom font.</option> <option value="">Hey me too!</option> <option value="">Averia Libre</option> </select></code>
Próbowałem utworzyć osobną klasę dla samych opcji, ale nie miało to żadnego wpływu.
Aby to zilustrować, oto aJSFiddle.
Chrom:
Firefox: