Ustawiłem niestandardową czcionkę i tło dla początkowego widoku listy rozwijanej (Wybierz opcję). Model font-size
ma 20 pikseli i wygląda wspaniale z niestandardową czcionką. Jednak kiedy klikam na liście, same opcje nie używają niestandardowej czcionki i wyglądają normalnie, z wyjątkiem font-size
, która wydaje się przenosić. Wydaje się, że tak jest tylko w przypadku Chrome (testowałem także Safari i Firefox).Jak zmienić rozmiar czcionki listy (nie widok początkowy)?
@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';
}
<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>
Próbowałem tworzyć oddzielną klasę dla samych opcji, ale które nie wydają się mieć żadnego wpływu.
Aby zilustrować dalej, oto JSFiddle.
Chrome:
Firefox:
możesz dołączyć trochę css, aby pomóc w odpowiedzi na to pytanie. – frontendzzzguy
@trickeedickee http://jsfiddle.net/bumpy009/wpHKe/7/ – domino
To jest naprawdę dziwne. Jak dotąd działa dobrze dla trzech osób, które sprawdzają twój problem, problem może w tobie być. Ale nie mam pojęcia, dlaczego. Chciałbym usłyszeć, jeśli ktoś jeszcze nie zobaczy niestandardowej czcionki. – Peter