Uzyskiwanie różnych typów figury z czcionek Google Web

Według this page:Uzyskiwanie różnych typów figury z czcionek Google Web

[Raleway] jest wyświetlacz twarzy i pobieranie oferuje zarówno starych stylu i podszewka cyfr, standardowe i Ligatury, A ładny kompletny zestaw znaków diakrytycznych oraz stylistyka inspirowana za pomocą bardziej geometrycznych czcionek sans-serif, niż ich neo-groteskowy, zainspirowany zestaw znaków domyślnych .

(Kopalnia nacisk)

Domyślną cyframi jest "stary styl" ("onum" OpenType feature string), które wyglądają dość straszne, gdy używane w nagłówkach. Idealnie, chciałbym móc użyć wariantu "podszewka" ("lnum"), z kerningiem "tabelarycznym" ("tnum") (w przeciwieństwie do proporcjonalnego - "pnum").

Próbowałem stosując następujący blok font-feature-settings deklaracji, bezskutecznie:

font-feature-settings: "onum" off, "pnum" off, "lnum" on, "tnum" on; 
-moz-font-feature-settings: "onum=0, pnum=0, lnum=1, tnum=1";  /* Firefox */ 
-webkit-font-feature-settings: "onum" off, "pnum" off, "lnum" on, "tnum" on; /* WebKit */ 
-o-font-feature-settings: "onum" off, "pnum" off, "lnum" on, "tnum" on;  /* Opera */

jakieś przemyślenia? Jeśli chciałbym pobrać pełną czcionkę, a następnie ponownie wyeksportować ją jako czcionkę internetową, w jaki sposób mógłbym to zrobić, jednocześnie upewniając się, że otrzymuję dane z okładki?

Dzięki!

Źródło

2013-06-20 aendrew

Należy pamiętać, że nigdy nie było wsparcia dla "-o-font-feature-settings" w Presto] (http://www.opera.com/docs/specs/presto2.12/css/fonts/). Przełączając się na Blink Opera 15 rozpoczęto obsługę '-webkit-font-feature-settings'. –

Odpowiedzi udzielone kompleksowo i bardziej poprawne tutaj: http://stackoverflow.com/a/15161336/1696030 –

Od tej strony: http://clagnut.com/sandbox/css3/

.lnum { 
    font-variant-numeric: lining-nums; 
    -moz-font-feature-settings:"lnum" 1; 
    -moz-font-feature-settings:"lnum=1"; 
    -ms-font-feature-settings:"lnum" 1; 
    -o-font-feature-settings:"lnum" 1; 
    -webkit-font-feature-settings:"lnum" 1; 
    font-feature-settings:"lnum" 1; 
}

działa tylko z plikami .OTF teraz, nie z czcionki Odtwarzacze umieszczone w serwisie Google Czcionki Webfonts. Nieobsługiwane w Safari. Możesz przetestować inne funkcje czcionki i obsługę przeglądarki tutaj: https://www.typotheque.com/articles/opentype_features_in_web_browsers_-_tests

Źródło

2013-06-20 19:28:10 jcummins

to faktycznie teraz działa (z czcionek internetowych google) w FF 28 (nightly) i Chrome 33 (kanarek). Nie w Safari 7 ... –

działa to znakomicie, ALE gdy umieścisz go w elemencie, który ma FLOAT LEFT lub DISPLAY INLINE BLOCK, wyrzuca czcionki i sprawia, że tekst jest ułożony jeden na drugim. Czy ktoś wie dlaczego? lub obejście? – CodeGodie

@DiegoCamacho też to zauważył. Wydaje mi się, że jest to zbyt krwawiące dla Chrome/Safari ... Czcionki, które nie mają cech (lub czegoś innego, czego nie potrafię zidentyfikować) powodują wszelkie dziwne zachowania. Kiedy mam włączone 'onum', zaznaczenie tekstu powoduje szaleństwo odwrotnego kierunku. – Drew

Jeśli chcesz pobrać czcionkę i wygenerować nową wersję z numerami okładek lub innymi funkcjami OpenType, sprawdź kod http://www.fontsquirrel.com/tools/webfont-generator.

Musisz wejść w tryb eksperta, ale następnie pod spłaszczeniem OpenType możesz wybrać Wyściełane cyfry. Jeśli jesteś tak skłonny, możesz nawet wygenerować wersję z alternatywnym formularzem W.

Do końca 2014 r. Jest to jedyny sposób, aby uzyskać numery katalogowe w Safari.

Źródło

2014-10-11 05:09:51 wbond

Wydaje się, że czcionka Wiewiórka została zaktualizowana: istnieje teraz opcja zachowania wszystkich funkcji ... jest niesamowita. – WraithKenny

Aby odpowiedzieć na odpowiedź wbonda, która powinna w pełni zająć to stanowisko, tryb eksperta w wiewiórce będzie początkowo wydawał się onieśmielający. Wspomniał jednak o ważnej alternatywnej W, która jest dość dużą różnicą dla raleway. Zwróć uwagę, że G różni się także między stylami.

Po prostu wstaw "sól" w polu Funkcje OpenType i pobierz zestaw.

Następnie gdziekolwiek chcesz mieć dostęp do stylu sól, dodać do tego css:

-moz-font-feature-settings:"salt" 1; 
    -ms-font-feature-settings:"salt" 1; 
    -o-font-feature-settings:"salt" 1; 
    -webkit-font-feature-settings:"salt" 1; 
    font-feature-settings:"salt" 1;

Niestety, ten powinien być komentarz na tej odpowiedzi, ale nie można dodać obraz do komentarzy. Zaoszczędziłoby mi to trochę czasu, gdyby ktoś inny miał ten obraz, żeby mi pokazać, więc poczułem, że warto go opublikować.

Źródło

2017-01-27 23:11:52

Uzyskiwanie różnych typów figury z czcionek Google Web

Odpowiedz

Powiązane problemy