css – 如何更改列表的字体大小(不是初始视图)

我为下拉列表的初始视图设置了自定义字体和背景(选择一个选项).字体大小为20像素,使用自定义字体看起来很棒.但是,当我单击列表时,选项本身不使用自定义字体并且看起来正常,除了字体大小,似乎可以继续.这似乎只是Chrome的情况(我也测试了Safari和Firefox).

@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';
}

hey me too!

我尝试为选项本身创建一个单独的类,但这似乎没有任何影响.

为了进一步说明,这是一个JSFiddle.

铬：

火狐：

最佳答案

我同意彼得,但是使用：

select {
  font-size: 20px;
  font-family: 'Averia Libre',cursive;
}

在CSS上将更改所有下拉字体,所以他应该使用类而不是总选择

CSS

.selectClass {
   font-size: 25px;
   font-family: 'Impact',cursive;
}​

和HTML

hey me too!

或者你可以直接看到小提琴
http://jsfiddle.net/sNkDW/

原文地址：https://www.jb51.cc/css/427307.html

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 [e-mail] 举报，一经查实，本站将立刻删除。