Korzystanie @fontface załadować czcionki kursywa

Question

mam css tak:

@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBold.ttf'); 
    font-weight:normal; 
    font-style: normal; 
} 
@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBoldItalic.ttf'); 
    font-weight:normal; 
    font-style: italic, oblique; 
} 
@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBlack.ttf'); 
    font-weight:bold; 
    font-style: normal; 
} 
@font-face { 
    font-family: 'alegreya'; 
    src:url('fonts/AlegreyaBlackItalic.ttf'); 
    font-weight:bold; 
    font-style: italic, oblique; 
} 

a reguła dla mojej klasy tak:

.font-alegreya { 
    font-family:alegreya; 
} 

I wreszcie HTML:

<li class="font-alegreya" data-styles="bold, italic, extrabold"> 
    Alegreya - Some sample words. 
</li> 

teraz , Czytałem here on metaltoad i inne miejsca na SO, że używanie jednej rodziny czcionek jest preferowanym sposobem używania niestandardowych czcionek i Na koniec musisz pogrubić kursywą.

Problem polega na tym, że czcionka jest wyświetlana kursywą. Korzystając z klasy font-weight:normal w klasie css, uzyskuję normalną wagę wyświetlania, ale font-style:normal nie usuwa wyróżnienia kursywą. Ma to sens, ponieważ w sekcji "-webkit" "narzędzi programistycznych" w zakładce "zasoby" widzę tylko załadowaną czcionkę black-italic (drugą w moim pliku CSS). Czcionka jest zainstalowana na moim komputerze, ale zmieniłem nazwę pliku na serwerze.

Zaobserwowałem to w operze (webkit) i IE11, więc to mój kod.

Edytuj: Jak wspomniano w komentarzach, miałem odwagę i czerń odwróconą. To jest pogrubione. Ale kursywą nadal stanowi problem.

Answer 1

Jako autorytatywna odpowiedź na @fontface na pytania dotyczące stanów, this spec mówi, że oblique, italic jest ważne.

Jak stwierdził, FF 3.6 nie lubi dwóch wartości. Pochowany w comments istnieje więcej raportów o braku wartości dwuelementowych.

Po wykopaniu się w webkit bug reports odkryłem, że wartość dla font-style zgodnie z zaleceniem zmieniła się z CSS2 na CSS3. Według wartości later css3 spec tylko jedna wartość jest dozwolona dla właściwości font-style, a nie jako lista rozdzielana przecinkami.

Tak więc obecnie, jeśli przekazujesz listę rozdzielaną przecinkami, silnik renderujący mówi "nie jest to poprawny styl czcionki. Musiało to oznaczać normal." I zastępuje twoją poprzednią normalną deklarację.

tl; dr: Jeśli twarz czcionka jest rendering wszystkie kursywą:

font-style: italic, oblique; 

powinny być

font-style: italic;