Es gibt mehrere Möglichkeiten, dies zu erreichen. Ich mache das eigentlich ziemlich oft, weil ich sehr daran interessiert bin, wie CSS funktioniert, und ich liebe auch Typografie. Die zwei Möglichkeiten, wie ich das mache, sind:
So interpretieren Sie das font-family
CSS:
Die font-family
Eigenschaft bestimmt, welche Schriftarten verwendet werden. In dieser Eigenschaft werden Schriftarten durch Kommas getrennt . Beim Rendern der Seite durchsucht ein Browser diese Liste und verwendet die erste Schriftart auf dem Computer . In vielen Fällen befindet sich am Ende dieser Eigenschaft auch eine Schriftartkategorie, die nur "nur für den Fall" ist, sodass die Standardschriftart für diese Kategorie verwendet wird, wenn keine anderen verfügbar sind.
Ein Beispiel: Nehmen wir an, dies ist ein CSS für ein <p>
Gehäuse.
p.thisisasampleclass
{
font-family: Calibri, "Comic Sans MS", Georgia, sans-serif;
}
Hier versucht der Browser zunächst, Calibri zu verwenden, wenn die Schriftart verfügbar ist. Wenn nicht, wird Comic Sans MS oder Georgia oder nur die serifenlose Standardschrift verwendet, wenn die anderen nicht verfügbar sind.
So können Sie herausfinden, welche Schriftarten verwendet werden. Ich habe keine gut gebauten und hilfreichen Tools gefunden, die das CSS auf sehr schöne Weise visualisieren, aber ich denke, dass die Inspector-Option für Sie funktioniert (es ist nicht zu verwirrend!). Ich denke, dass dies der richtige Weg ist.
Beispiel für das Auffinden von NYTimes-Schriftarten mit einem Inspector-Tool:
Ich werde Ihnen zeigen, wie Sie mit Google Chrome die Schriftarten für den Haupttext eines NYTimes-Artikels finden .
Gehen Sie zu einem Artikel auf NYTimes.com, klicken Sie mit der rechten Maustaste auf ein Textelement, für das Sie die Schriftarten suchen möchten, und klicken Sie auf Element überprüfen .
Schauen Sie sich die Seitenleiste rechts an. In der Dropdown-Liste Berechneter Stil sehen Sie die CSS-Eigenschaften für dieses Element. Wie Sie jedoch sehen können, gibt es hier derzeit keine Eigenschaft für die Schriftfamilie. Dies bedeutet, dass die Schriftarten global definiert sind, nicht nur für dieses bestimmte Element. Es gibt jedoch einen Weg, dies zu umgehen!
Folgendes tun Sie: Aktivieren Sie das Optionsfeld neben "Geerbt anzeigen".
Viele andere globale Eigenschaften werden unter "Berechneter Stil" angezeigt.
Scrollen Sie in der Liste nach unten zu "Schriftfamilie". Es sollte grau sein, was bedeutet, dass es sich um eine geerbte globale Eigenschaft handelt. Hier sehen Sie die verwendeten Schriftarten! Ta-da!