FFでうまく動作するタグにさまざまなカスタムフォントを統合しましたが、は（chrome & safari）のようなウェブキットブラウザでは機能しません。選択オプションタグ内のカスタムフォント
<select>
<option value="" style="font-family: 'Averia Libre'!important;">I'm a custom font.</option>
<option value="" style="font-family: 'cancun', cursive;">Hey me too!</option>
<option value="" style="font-family: 'Averia Libre', cursive!important;">Averia Libre</option>
</select>
（すなわち、クライアントのマシン上にまだ存在しないこと）カスタムフォントを使用する唯一の方法は、カスタムフォントを（命名意味し、@font-faceを使用して、それをspecyfyすることですここで、 "Myfont"）、およびポイントに少なくとも一つ、ここで定義ファイル（TrueTypeフォント）：
@font-face {
font-family: "Myfont";
src: url(http://www.princexml.com/fonts/larabie/kimberle.ttf)
format("truetype");
}
h1 { font-family: "Myfont", sans-serif }
から3210： "WebKitのは、今CSSする@ font-face規則をサポートしています"
'@ font-face'は問題ではなく、'
あなたは正しいです、クエンティン。それでは、フォントがすでにクライアント側にあるというアイデアでは、新しい質問を誤解する可能性があります（または、スタイリングWebフォームは人間工学とアクセシビリティにとって危険ではありません）。 – yPhil
optionのCSSクラスを作成できます。このCSSクラスは、@ font-faceを使って定義された特定のフォントを使用します。 uがする@ font-faceは、あなたのCSSで定義された以下のしている場合 たとえば、
@font-face
{
font-family: "MyFont1";
src: url('Averia_Libre.ttf'),
url('Averia_Libre.eot'); /* IE9 */
}
@font-face {
font-family: "MyFont2";
src: url('cancun.ttf');
}
option.style1{
font-family: MyFont1;
}
option.style2{
font-family: MyFont2;
}
あなたのHTMLコードは、私が持っているので、私は、おそらくそれが動作するはずです、コードをテストしたhaventは
<select>
<option value="" class="style1">I'm a custom font.</option>
<option value="" class="style2">Hey me too!</option>
</select>
注意する必要があります私の覚えている仕事の一つでこれほど前にこのように行われました。
ブラウザベンダーは、フォームコントロールをスタイルするのが難しいと訴えています。あなたが完全にコントロールしたい場合は、同じものを見るように作られた何か（olやulのようなもの）で置き換えてください。 – reisio
こんにちはありがとう@reisio、私はこの材料を配置する必要があるul liの構造を使用することはできません。 – matthewb
もちろん、可能です。 – reisio