Ist es möglich eine Mac OS-spezifischen CSS-fix-font-Unterschied?

Arbeite ich an einem Projekt mit einem designer, und er Bestand darauf, auf einige bestimmte schriftart für Titel und verschiedene Elemente in die Seite. Wir brauchen also eine schriftart kit einbetten mit @font-face.

Es funktioniert perfekt auf dem PC (Firefox, IE 7 und 8, Chrome, Safari), aber bei Mac OS (Safari und Firefox) die Schrift nicht vertikal ausgerichtet werden auf die gleiche Weise. Nach der Suche auf der Web, ich fand keine Lösung dafür, außer "es gibt immer Unterschiede zwischen den Browsern und Plattformen, live with it".

Ich weiß, die Schriften sind nie gerendert genau die gleichen Plattformen, aber dieses mal ist es nicht so etwas wie die Schrift sieht eher Fett oder so ähnlich. Die Schrift sieht aus, als ob es baseline ist völlig unterschiedlich zwischen Windows und Mac OS X. Auf Mac OS, die schriftart, bei einer Größe von 16px ist 3px höher als auf dem PC.

So, ich bin auf der Suche nach einer backup-Lösung : gibt es eine Möglichkeit zum erstellen einer CSS-speziell für Mac OS-Benutzer? Ich will nicht, um den Gegner nur Safari, da Safari PC ist ok und Firefox Mac ist nicht ok.

Ist oder wenn Sie eine Lösung für die baseline-Unterschied, dass nicht verlangen, eine bestimmte CSS-Datei, ich würde mich freuen, es zu hören.

Dank!

InformationsquelleAutor Gabriel | 2011-01-15
  1. 0

    Wenn die Einstellung eine explizite line-height nicht, das problem zu beheben, können dazu dienen, verschiedene stylesheets für jeden browser mit dem Ihr backend und die Erkennung der OS in Ihrer Anwendung (über den user-agent). Sie können auch etwas in JS die gleiche Sache zu tun, aber es wird wahrscheinlich ein FOUC, während JS lädt die entsprechenden Stile.

    • Einstellung eine explizite line-height nicht, das problem zu beheben. Es schon versucht. Ausschnüffeln der user-agent ist nicht meine erste Wahl, weil es ist so einfach, es zu ändern und dann würde es nicht funktionieren...
    • Ich wählte diese Lösung, weil Sie server-side browser sniffing ist das kleinere übel meiner Meinung nach. Und es funktioniert immer noch, wenn der Benutzer verwendet die seltsamen "javascript deaktivieren" - option.
    InformationsquelleAutor coreyward
  2. 13

    Ich fürchte, dass die browser - /os-sniffing ist Ihre einzige option. CSS selbst hat keine Kenntnisse in OS noch tun, ich habe schon mal einen css-hack, dass die Ziele osx spezifisch.

    Dies ist der einfachste Weg für mich zu erkennen, OSX und fügen Sie den OSX-Klasse an das Dokument Körper, so können Sie überschreiben die css-Formatvorlagen für OSX spezifisch.

    if(navigator.platform.match('Mac') !== null) {
    document.body.setAttribute('class', 'OSX');
}
    InformationsquelleAutor ChrisR
  3. 0

    Es ist ein einfacher Weg. http://rafael.adm.br/css_browser_selector/

    Er erkennt den browser und das Betriebssystem und ermöglicht Ihnen anzugeben, Klassen, die spezifisch für ihn.

    • Das ist im Grunde das gleiche wie ich geschrieben, der einzige Unterschied ist, dass es fügt eine Menge von zusätzlichen code zum schnuppern für andere os ' es zu. In diesem Fall braucht er diese nur, um den Gegner OSX ist sehr viel einfacher gelöst mit ein paar Zeilen code.
    InformationsquelleAutor MrMaksimize
  4. 0

    Wenn Sie wollen in der Nähe zu perfekt und schmerzlos, Sie gehen zu müssen, verwenden Sie gängige Schriftarten oder Schriftarten, die von einem online-Dienst wie Google das Kostenlose font-Bibliothek oder einer der for-pay-font-Bibliotheken. Diese Schriften wurden entwickelt und getestet, um die Arbeit im web.

    Experimentieren und einschließlich Schriftarten für browser des Benutzers herunterladen und versuchen Sie korrekt anzuzeigen, ist in Ordnung, aber nicht perfekt und wird nicht schmerzlos sein. Auch, seien Sie sehr vorsichtig mit der Lizenzierung Einschränkungen - stellen Sie sicher, dass die Schriftarten Ihre designer verwenden will, sind ordnungsgemäß lizenziert für die Verwendung auf der Kunden-website.

    Wenn Sie zu tun haben, browser-sniffing und dienen mehrere stylesheets an dieser Stelle möchte ich sagen, Ihr design ist gebrochen und muss überarbeitet werden. Zeigen https://fonts.google.com zu Ihrem designer-und finden, wenn er mag, jeder von denen - Sie arbeiten cross-Plattform, die in allen modernen Browsern und einige sind sehr glatt. EDIT: Oh, und Sie sind frei zu verwenden, ohne sorgen für die Lizenzierung.

    InformationsquelleAutor jeffszusz
Schreibe einen Kommentar