Make Adobe fonts work with CSS3 @ font-face in IE9

Jak powiedział Knu, możesz użyć tego narzędzia , Jednak jest ono skompilowane tylko dla MS-DOS. Skompilowałem go dla Win64. Pobierz .

Użycie:

1. Miejsce .exe w tym samym folderze co czcionka musisz zmodyfikować

2. Przejdź do tego katalogu w wierszu poleceń

3. Type embed fontname.fonttype, zastępując fontname nazwą pliku, a fonttype rozszerzeniem tzn. embed brokenFont.ttf

4. Gotowe! Twoja czcionka powinna teraz praca.

Powinieneś ustawić format czcionki ie na 'embedded-opentype', a nie 'eot'. Na przykład:

src: url('fontname.eot?#iefix') format('embedded-opentype')

Otrzymałem następujący błąd:

CSS3114: @ font-face nie powiodło się sprawdzanie uprawnień osadzania OpenType. Pozwolenie musi być instalowalne.
fontname.ttf

Po użyciu poniższego kodu mój problem został rozwiązany....

src: url('fontname.ttf') format('embedded-opentype')

Dziękuję wam za pomoc!
Pozdrawiam,
Renjith.

Spróbuj tego, dodaj tę linię w sieci.config.

<system.webServer>
  <staticContent>
     <mimeMap fileExtension=".woff" mimeType="application/octet-stream" />
  </staticContent>
</system.webServer>

Inna odpowiedź: kwestie prawne.

Oto Twoja odpowiedź:

Najpierw upewnij się, że używasz najlepszego kodu w .css, zobacz inne odpowiedzi css na to.
Przykład IE 11 css (działa w wszystkie nowoczesne przeglądarki mogą wymagać poprawienia dla IE9):

@font-face {
font-family: "QuestionableLegalFont";
font-weight: bold;
src: url('../fonts/QuestionableLegalFont.ttf') format('truetype');
}

Następnie upewnij się, że masz działającą czcionkę internetową(prawdopodobnie już to wiesz, widząc czcionkę w innych przeglądarkach). Jeśli potrzebujesz konwertera czcionek online, sprawdź tutaj: https://onlinefontconverter.com/

Wreszcie, aby pozbyć się błędu "CSS3114". Aby uzyskać narzędzie online, Kliknij tutaj: https://www.andrebacklund.com/fontfixer.html

Prawdą jest, że IE9 wymaga czcionek TTF, aby bity osadzania były ustawione na instalowalne. Generator robi to automatycznie, ale obecnie blokujemy czcionki Adobe z innych powodów. Możemy znieść to ograniczenie w najbliższej przyszłości.

Zmarnowałem dużo czasu z powodu tego problemu. W końcu sam znalazłem świetne rozwiązanie. Zanim brałem .tylko czcionka ttf. Ale dodałem jeden dodatkowy format czcionki .eot, który zaczął działać w IE.

Użyłem poniższego kodu i działał jak charm we wszystkich przeglądarkach.

@font-face {
font-family: OpenSans;
src: url(assets/fonts/OpenSans/OpenSans-Regular.ttf), 
url(assets/fonts/OpenSans/OpenSans-Regular.eot);
}

@font-face {
font-family: OpenSans Bold;
src: url(assets/fonts/OpenSans/OpenSans-Bold.ttf),
url(assets/fonts/OpenSans/OpenSans-Bold.eot);
}

Jako użytkownik Mac, nie byłem w stanie korzystać z narzędzi linii poleceń MS-DOS i Windows, o których wspomniano, aby naprawić uprawnienia do osadzania czcionek. Jednak dowiedziałem się, że możesz to naprawić za pomocą FontLab, aby ustawić pozwolenie na "wszystko jest dozwolone". Mam nadzieję, że ten przepis jak ustawić uprawnienia czcionki do instalacji na Mac OS X jest przydatny również dla innych.

Jeśli znasz nodejs/npm, ttembed-js jest łatwym sposobem na ustawienie flagi "installable embedding allowed" na czcionce TTF. Spowoduje to modyfikację podanego .plik ttf:

npm install -g ttembed-js

ttembed-js somefont.ttf

Problem może być związany z konfiguracją serwera-może to nie być wysyłanie właściwych nagłówków dla plików czcionek. Zapoznaj się z odpowiedzią na pytanie IE9 blokuje pobieranie cross-origin Web font.

EricLaw sugeruje dodanie następujących elementów do konfiguracji Apache

<FilesMatch "\.(ttf|otf|eot|woff)$">
    <IfModule mod_headers.c>
        Header set Access-Control-Allow-Origin "http://mydomain.com"
    </IfModule>
</FilesMatch>

Dla każdego, kto dostaje błąd: "tableversion musi być 0, 1 lub i jest hex: 003" podczas korzystania z ttfpatch, skompilowałem embed dla 64bit. Nic nie zmieniłem, tylko dodałem potrzebne libs i skompilowałem. Stosować na własne ryzyko.

Użycie: czcionka ConsoleApplication1.ttf

Http://www.mediafire.com/download/8x1px8aqq18lcx8/ConsoleApplication1.exe

Jeśli chcesz to zrobić ze skryptem PHP zamiast uruchamiać kod C (lub jesteś na komputerze Mac takim jak ja i nie możesz kompilować z Xcode tylko czekać rok na jego otwarcie), oto funkcja PHP, której możesz użyć do usunięcia uprawnień do osadzania z czcionki:

function convertRestrictedFont($filename) {
    $font = fopen($filename,'r+');
    if ($font === false) {
        throw new Exception('Could not open font file.');
    }

    fseek($font, 12, 0);

    while (!feof($font)) {
        $type = '';
        for ($i = 0; $i < 4; $i++) {
            $type .= fgetc($font);
            if (feof($font)) {
                fclose($font);
                throw new Exception('Could not read the table definitions of the font.');
            }
        }
        if ($type == 'OS/2') {
            // Save the location of the table definition
            // containing the checksum and pointer to the data
            $os2TableDefinition = ftell($font);
            $checksum = 0;

            for ($i = 0; $i < 4; $i++) {
                fgetc($font);
                if (feof($font)) {
                    fclose($font);
                    throw new Exception('Could not read the OS/2 table header of the font.');
                }
            }

            // Get the pointer to the OS/2 table data
            $os2TablePointer = ord(fgetc($font)) << 24;
            $os2TablePointer |= ord(fgetc($font)) << 16;
            $os2TablePointer |= ord(fgetc($font)) << 8;
            $os2TablePointer |= ord(fgetc($font));

            $length = ord(fgetc($font)) << 24;
            $length |= ord(fgetc($font)) << 16;
            $length |= ord(fgetc($font)) << 8;
            $length |= ord(fgetc($font));

            if (fseek($font, $os2TablePointer + 8, 0) !== 0) {
                fclose($font);
                throw new Exception('Could not read the embeddable type of the font.');
            }

            // Read the fsType before overriding it
            $fsType = ord(fgetc($font)) << 8;
            $fsType |= ord(fgetc($font));

            error_log('Installable Embedding: ' . ($fsType == 0));
            error_log('Reserved: ' . ($fsType & 1));
            error_log('Restricted License: ' . ($fsType & 2));
            error_log('Preview & Print: ' . ($fsType & 4));
            error_log('Editable Embedding: ' . ($fsType & 8));
            error_log('Reserved: ' . ($fsType & 16)); 
            error_log('Reserved: ' . ($fsType & 32));
            error_log('Reserved: ' . ($fsType & 64));
            error_log('Reserved: ' . ($fsType & 128));
            error_log('No subsetting: ' . ($fsType & 256));
            error_log('Bitmap embedding only: ' . ($fsType & 512));                         
            error_log('Reserved: ' . ($fsType & 1024));
            error_log('Reserved: ' . ($fsType & 2048));
            error_log('Reserved: ' . ($fsType & 4096));
            error_log('Reserved: ' . ($fsType & 8192));
            error_log('Reserved: ' . ($fsType & 16384));
            error_log('Reserved: ' . ($fsType & 32768));

            fseek($font, ftell($font) - 2);

            // Set the two bytes of fsType to 0
            fputs($font, chr(0), 1);
            fputs($font, chr(0), 1);

            // Go to the beginning of the OS/2 table data
            fseek($font, $os2TablePointer, 0);

            // Generate a new checksum based on the changed 
            for ($i = 0; $i < $length; $i++) {
                $checksum += ord(fgetc($font));
            }
            fseek($font, $os2TableDefinition, 0);
            fputs($font, chr($checksum >> 24), 1);
            fputs($font, chr(255 & ($checksum >> 16)), 1);
            fputs($font, chr(255 & ($checksum >> 8)), 1);
            fputs($font, chr(255 & $checksum), 1);

            fclose($font);

            return true;
        }
        for ($i = 0; $i < 12; $i++) {
            fgetc($font);
            if (feof($font)) {
                fclose($font);
                throw new Exception('Could not skip a table definition of the font.');
            }
        }
    }

    fclose($font);

    return false;
}

Upewnij się, że wykonałeś kopię zapasową pliku czcionki przed uruchomieniem tego kodu i nie obwiniaj mnie, jeśli jest uszkodzony.

oryginalne źródło w C można znaleźć tutaj .

Możesz go rozwiązać za pomocą kodu

@font-face {
  font-family: 'Font-Name';
  src: url('../fonts/Font-Name.ttf');
  src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype');
}

Znalazłem eot Plik powinien być umieszczony poza ttf. Jeśli jest pod ttf, jeśli czcionka wyświetla się poprawnie, IE9 nadal wyrzuci błąd.

Polecam:

@font-face {
  font-family: 'Font-Name';
  src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype');
  src: url('../fonts/Font-Name.ttf')  format('truetype');
}

Nie Polecam:

@font-face {
  font-family: 'Font-Name';
  src: url('../fonts/Font-Name.ttf')  format('truetype');
  src: url('../fonts/Font-Name.eot?#iefix') format('embedded-opentype');
  }

Próbowałem narzędzia ttfpatch i nie zadziałało. Internet Exploder 9 i 10 nadal narzekał.

Znalazłem ten fajny Git gist i rozwiązał moje problemy. https://gist.github.com/stefanmaric/a5043c0998d9fc35483d

Wystarczy skopiować i wkleić kod do css.

Ostatnio napotkałem ten problem z .eot i .czcionki otf powodujące błędy CSS3114 i CSS3111 w konsoli podczas ładowania. Rozwiązanie, które działało dla mnie, było tylko do użycia .woff i .formaty woff2 z ... TTF format fallback. The .formaty woff będą używane wcześniej .ttf w większości przeglądarek i wydaje się, że nie powoduje problemu z uprawnieniami do osadzania czcionek (css3114) i problemu z nieprawidłowym nazewnictwem czcionek (css3111). Znalazłem swoje rozwiązanie w tym niezwykle pomocnym artykule o CSS3111 i css3114 wydają, a także czytają Ten artykuł o używaniu @font-face .

Uwaga: To rozwiązanie nie wymaga ponownej kompilacji, konwersji ani edycji żadnych plików czcionek. Jest to rozwiązanie tylko dla css. Czcionka, którą testowałem, miała .eot,otf,woff,woff2 i .wersje svg wygenerowane dla niego, prawdopodobnie z oryginału .źródło ttf, które wytworzyło błąd 3114, gdy próbowałem go jednak .woff i .pliki woff2 wydawały się być odporne na ten problem.

This Is what Czy praca dla mnie z @ font-face:

@font-face {
  font-family: "Your Font Name";
  font-weight: normal;
  src: url('your-font-name.woff2') format('woff2'),
       url('your-font-name.woff') format('woff'),
       url('your-font-name.ttf')  format('truetype');
}

To spowodowało błędy z @ font-face W IE:

@font-face {
  font-family: 'Your Font Name';
  src: url('your-font-name.eot');
  src: url('your-font-name.eot?#iefix') format('embedded-opentype'),
       url('your-font-name.woff2') format('woff2'),
       url('your-font-name.woff') format('woff'),
       url('your-font-name.ttf')  format('truetype'),
       url('your-font-name.svg#svgFontName') format('svg');
}

To działa dla mnie:

@font-face {
  font-family: FontName;
  src: url('@{path-fonts}/FontName.eot?akitpd');
  src: url('@{path-fonts}/FontName.eot?akitpd#iefix') format('embedded-opentype'),
    url('@{path-fonts}/FontName.ttf?akitpd') format('truetype'),
    url('@{path-fonts}/FontName.woff?akitpd') format('woff'),
    url('@{path-fonts}/FontName.svg?akitpd#salvage') format('svg');
}