Add tip: check font installed locally

Author: AllThingsSmitty

translations/de-DE/README.md

@@ -22,6 +22,7 @@ Eine Sammlung an Tipps, um deine CSS-Fähigkeiten zu professionalisieren.
 1. [Übernehme `box-sizing`](#Übernehme-box-sizing)
 1. [Benutze `unset`, anstatt alle Eigenschaften zurückzusetzen](#benutze-unset-anstatt-alle-eigenschaften-zurückzusetzen)
 1. [Benutze `:not()` um Rahmen an die Navigation zu setzen oder zu entfernen](#benutze-not-um-rahmen-an-die-navigation-zu-setzen-oder-zu-entfernen)
+1. [Kontroller, om skrifttypen er installeret lokalt](#Kontroller-om-skrifttypen-er-installeret-lokalt)
 1. [Ergänze `line-height` an `body`](#ergänze-line-height-an-body)
 1. [Setze `:focus` für Form-Elemente](#setze-focus-für-form-elemente)
 1. [Zentriere alles vertikal](#zentriere-alles-vertikal)
@@ -152,6 +153,34 @@ Sicher, du kannst `.nav li + li` verwenden, aber mit `:not()` ist die Absicht se
 <sup>[zurück zum Inhaltsverzeichnis](#inhaltsverzeichnis)</sup>
 
 
+### Check If Font Is Installed Locally](#check-if-font-is-installed-locally)
+
+### Kontroller, om skrifttypen er installeret lokalt
+
+Du kan kontrollere, om en skrifttype er installeret lokalt, før du henter den eksternt, hvilket også er et godt ydelsestip.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+Hat tip til Adam Argyle for at dele denne protip og [demoen](https://codepen.io/argyleink/pen/VwYJpgR).
+
+<sup>[zurück zum Inhaltsverzeichnis](#inhaltsverzeichnis)</sup>
+
+
 ### Ergänze `line-height` an `body`
 
 Du brauchst kein `line-height` an jedes `<p>`, `<h*>`, usw separat zu schreiben. Ergänze es stattdessen an `body`:

translations/es-ES/README.md

@@ -22,6 +22,7 @@ Una colección de consejos para ayudarte a mejorar tus conocimientos profesional
 1. [Heredar `box-sizing`](#heredar-box-sizing)
 1. [Utilice `unset` en lugar de restablecer todas las propiedades](#utilice-unset-en-lugar-de-restablecer-todas-las-propiedades)
 1. [Usar `:not()` para Aplicar o Cancelar la aplicación de bordes en la navegación](#usar-not-para-aplicar-o-cancelar-la-aplicación-de-bordes-en-la-navegación)
+1. [Compruebe si la fuente está instalada localmente](#compruebe-si-la-fuente-está-instalada-localmente)
 1. [Añadir `line-height` al `body`](#añadir-line-height-al-body)
 1. [Establecer `:focus` para elementos de formulario](#establecer-focus-para-elementos-de-formulario)
 1. [Centrar cualquier cosa verticalmente](#centrar-cualquier-cosa-verticalmente)
@@ -153,6 +154,32 @@ El selector CSS define los bordes de la forma en que un ser humano lo describir
 <sup>[volver al índice de contenidos](#tabla-de-contenido)</sup>
 
 
+### Compruebe si la fuente está instalada localmente
+
+Puede verificar si una fuente está instalada localmente antes de buscarla de forma remota, lo que también es un buen consejo de rendimiento.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+Felicitaciones a Adam Argyle por compartir este protip y [demo](https://codepen.io/argyleink/pen/VwYJpgR).
+
+<sup>[volver al índice de contenidos](#tabla-de-contenido)</sup>
+
+
 ### Añadir `line-height` al `body`
 
 No es necesario añadir `line-height` a cada` <p> `,` <h *> `, _et al_. por separado. En su lugar, agregalo al `body`:

translations/fr-FR/README.md

@@ -22,6 +22,7 @@ Une collection de conseils pour vous aider à mener vos compétences CSS au nive
 1. [Hériter de `box-sizing`](#hériter-de-box-sizing)
 1. [Utilisez `unset` au Lieu de Réinitialiser Toutes les Propriétés](#utilisez-unset-au-lieu-de-réinitialiser-toutes-les-propriétés)
 1. [Utiliser `:not()` pour Appliquer / ne pas Appliquer des Bordures à la Barre de Navigation](#utiliser-not-pour-appliquer--ne-pas-appliquer-des-bordures-à-la-barre-de-navigation)
+1. [Vérifiez si la police est installée localement](#vérifiez-si-la-police-est-installée-localement)
 1. [Ajouter `line-height` à `body`](#ajouter-line-height-à-body)
 1. [Définissez `: focus` pour les Éléments de Formulaire](#définissez-focus-pour-les-éléments-de-formulaire)
 1. [Tout Centrer Verticalement](#tout-centrer-verticalement)
@@ -153,6 +154,32 @@ Le sélecteur CSS définit la frontière comme un humain la décrirait.
 <sup>[retour à la table des matières](#table-des-matières)</sup>
 
 
+### Vérifiez si la police est installée localement
+
+Vous pouvez vérifier si une police est installée localement avant de la récupérer à distance, ce qui est également une bonne astuce de performance.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+Pointe du chapeau à Adam Argyle pour avoir partagé ce protip et cette [démo](https://codepen.io/argyleink/pen/VwYJpgR).
+
+<sup>[retour à la table des matières](#table-des-matières)</sup>
+
+
 ### Ajouter `line-height` à `body`
 
 Vous n'avez pas besoin d'ajouter `line-height` à chaque `<p>`, `<h*>`, _et al_. séparément. Au lieu de cela, ajoutez-le à `body`:

translations/gr-GR/README.md

@@ -22,6 +22,7 @@
 1. [Κληρονόμιση του 'box-sizing'](#κληρονόμιση-του-box-sizing)
 1. [Χρήση `unset` Αντί Για Επαναφορά Όλων Των Ιδιοτήτων](#χρήση-unset-αντί-για-επαναφορά-όλων-των-ιδιοτήτων)
 1. [Χρήση `:not()` για Εφαρμόσεις/Βγάλεις τα Πλαίσια κατά την Περιήγηση](#χρήση-not-για-εφαρμόσειςβγάλεις-τα-πλαίσια-κατά-την-περιήγηση)
+1. [Überprüfen Sie, ob die Schriftart lokal installiert ist](#Überprüfen-sie-ob-die-schriftart-lokal-installiert-ist)
 1. [Προσθήκη `line-height` στο `body`](#προσθήκη-line-height-στο-body)
 1. [Θέσε `:focus` για Στοιχεία της Φόρμας](#θέσε-focus-για-στοιχεία-της-φόρμας)
 1. [Κάθετο-Κεντράρισμα Όλων](#κάθετο-κεντράρισμα-όλων)
@@ -152,6 +153,32 @@ button {
 <sup>[πίσω στον πίνακα περιεχομένων](#πίνακας-περιεχομένων)</sup>
 
 
+### Überprüfen Sie, ob die Schriftart lokal installiert ist
+
+Sie können überprüfen, ob eine Schriftart lokal installiert ist, bevor Sie sie remote abrufen. Dies ist auch ein guter Leistungstipp.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+Hutspitze an Adam Argyle für das Teilen dieses Protips und dieser [Demo](https://codepen.io/argyleink/pen/VwYJpgR).
+
+<sup>[πίσω στον πίνακα περιεχομένων](#πίνακας-περιεχομένων)</sup>
+
+
 ### Προσθήκη `line-height` στο `body`
 
 Δεν χρειάζεται να προσθέσεις `line-height`σε κάθε `<p>`, `<h*>`, _et al_. ξεχωριστά. Αντ'αυτού, πρόσθεσέ το `body`:

translations/gu-IND/README.md

@@ -22,6 +22,7 @@
 1. [વારસો `box-sizing`](#વારસો-box-sizing)
 1. [બધા ગુણધર્મોને ફરીથી સેટ કરવાને બદલે 'અનસેટ' નો ઉપયોગ કરો](#બધા-ગુણધર્મોને-ફરીથી-સેટ-કરવાને-બદલે-અનસેટ-નો-ઉપયોગ-કરો)
 1. [વાપરવ `:not()` અરજી / અનપ્પેલી કરવા માટે નેવિગેશન પર બોર્ડર્સ](#વાપરવ-not-અરજી--અનપ્પેલી-કરવા-માટે-નેવિગેશન-પર-બોર્ડર્સ)
+1. [સ્થાનિક રીતે ફોન્ટ ઇન્સ્ટોલ કરેલું છે કે નહીં તે તપાસો](#સ્થાનિક-રીતે-ફોન્ટ-ઇન્સ્ટોલ-કરેલું-છે-કે-નહીં-તે-તપાસો)
 1. [ઉમેરો `line-height` તરફ `body`](#ઉમેર-line-height-તરફ-body)
 1. [ફોર્મ તત્વો માટે 'ધ્યાન કેન્દ્રિત કરો' સેટ કરો](#ફોર્મ-તત્વો-માટે-ધ્યાન-કેન્દ્રિત-કરો-સેટ-કરો)
 1. [વર્ટિકલ-કેન્દ્ર કંઈપણ](#ઊભું-કેન્દ્ર-કંઈપણ)
@@ -152,6 +153,32 @@ CSS પસંદગીકાર સીમાને વ્યાખ્યાય
 <sup>[સામગ્રીઓના કોષ્ટકમાં પાછા](#પ્રોપ્સ)</sup>
 
 
+### સ્થાનિક રીતે ફોન્ટ ઇન્સ્ટોલ કરેલું છે કે નહીં તે તપાસો
+
+તમે તપાસ કરી શકો છો કે ફોન્ટ તેને દૂરસ્થ રીતે લાવવા પહેલાં સ્થાનિક રૂપે ઇન્સ્ટોલ કરેલું છે કે નહીં, તે પણ એક સારા પ્રદર્શનની મદદ છે.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+આ પ્રોટીપ અને ડેમો શેર કરવા માટે એડમ આર્ગીલેને ટોપીની [મદદ](https://codepen.io/argyleink/pen/VwYJpgR).
+
+<sup>[સામગ્રીઓના કોષ્ટકમાં પાછા](#પ્રોપ્સ)</sup>
+
+
 ### ઉમેર `line-height` તરફ `body`
 
 તમારે ઉમેરવાની જરૂર નથી `line-height` to દરેક `<p>`, `<h*>`, _et al_. અલગ. તેની જગ્યાએ, તેને ઉમેરવા `body`:

translations/ja-JP/README.md

@@ -27,6 +27,7 @@ CSSのプロのスキルになるようにアドバイスのリストを紹介
 1. [box-sizingをコンポーネントごとに変更](#inherit-box-sizing)
 1. [すべてのプロパティをリセットする代わりに `unset`を使う](#use-unset-instead-of-resetting-all-properties)
 1. [`:not()` を使用 / ボーダーを削除](#use-not-to-applyunapply-borders-on-navigation)
+1. [フォントがローカルにインストールされているかどうかを確認します](#check-if-font-is-installed-locally)
 1. [`body`に`line-height`を加える](#add-line-height-to-body)
 1. [フォーム要素に `：focus`を設定する](#set-focus-for-form-elements)
 1. [天地の中央に配置](#vertically-center-anything)
@@ -167,6 +168,34 @@ CSSセレクターは、境界線を人間が表現する方法で定義しま
 <sup>[目次へ戻る](#table-of-contents)</sup>
 
 
+<div id="check-if-font-is-installed-locally"></div>
+
+### フォントがローカルにインストールされているかどうかを確認します
+
+フォントをリモートでフェッチする前に、フォントがローカルにインストールされているかどうかを確認できます。これもパフォーマンスのヒントになります。
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+このプロチップと[デモ](https://codepen.io/argyleink/pen/VwYJpgR)を共有してくれたAdam Argyleへの帽子のヒント.
+
+<sup>[目次へ戻る](#table-of-contents)</sup>
+
+
 <div id="add-line-height-to-body"></div>
 
 ### `body` に`line-height`を加える

translations/ko-KR/readme.md

@@ -25,6 +25,7 @@ CSS스킬을 프로처럼 만들어주는 팁 모음
 1. [`box-sizing`을 컴포넌트마다 변경](#inherit-box-sizing)
 1. [모든 프로퍼티를 리셋하는 대신에 `unset`를 쓴다](#use-unset-instead-of-resetting-all-properties)
 1. [`:not()` 를 사용하여 Border를 삭제](#use-not-to-applyunapply-borders-on-navigation)
+1. [글꼴이 로컬로 설치되어 있는지 확인](#check-if-font-is-installed-locally)
 1. [`body`에 `line-height` 넣기](#add-line-height-to-body)
 1. [폼 요소에`: focus`를 설정하십시오.](#set-focus-for-form-elements)
 1. [전부 Vertically-Center로 만들기](#vertically-center-anything)
@@ -165,6 +166,34 @@ CSS 선택기는 사람이 설명하는 방식으로 경계를 정의합니다.
 <sup>[목차로 돌아가기](#table-of-contents)</sup>
 
 
+<div id="check-if-font-is-installed-locally"></div>
+
+### 글꼴이 로컬로 설치되어 있는지 확인
+
+글꼴을 원격으로 가져 오기 전에 글꼴이 로컬에 설치되어 있는지 확인할 수 있으며 이는 좋은 성능 팁입니다.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+이 팁과 [데모](https://codepen.io/argyleink/pen/VwYJpgR)를 공유 한 Adam Argyle의 모자 팁.
+
+<sup>[목차로 돌아가기](#table-of-contents)</sup>
+
+
 <div id="add-line-height-to-body"></div>
 
 ### `body`에 `line-height` 넣기

translations/pl-PL/README.md

@@ -21,6 +21,7 @@ Zbiór porad, które pomogą Ci rozwinąć zawansowane umiejętności CSS.
 1. [Dziedziczenie `box-sizing`](#dziedziczenie-box-sizing)
 1. [Użyj `unset` zamiast resetowania wszystkich ustawień](#użyj-unset-zamiast-resetowania-wszystkich-ustawień)
 1. [Użyj `:not()` aby dodać/usunąć obramownie nawigacji](#użyj-not-aby-dodaćusunąć-obramownie-nawigacji)
+1. [Sprawdź, czy czcionka jest zainstalowana lokalnie](#sprawdź,-czy-czcionka-jest-zainstalowana-lokalnie)
 1. [Dodaj `line-height` do `body`](#dodaj-line-height-do-body)
 1. [Ustaw `:focus` dla elementów formularza](#ustaw-:focus-dla-form-elements)
 1. [Przesuń cokolwiek pionowo](#przesuwanie-w-pionie)
@@ -149,6 +150,32 @@ Selektor CSS definiuje granicę w sposób opisany przez człowieka.
 <sup>[powrót do spisu treści](#powrót-do-spisu-treści)</sup>
 
 
+### Sprawdź, czy czcionka jest zainstalowana lokalnie
+
+Możesz sprawdzić, czy czcionka jest zainstalowana lokalnie, przed jej zdalnym pobraniem, co również jest dobrą wskazówką dotyczącą wydajności.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+Czapka dla Adama Argyle'a za podzielenie się tym prototypem i [demonstracją](https://codepen.io/argyleink/pen/VwYJpgR).
+
+<sup>[powrót do spisu treści](#powrót-do-spisu-treści)</sup>
+
+
 ### Dodaj `line-height` do `body`
 
 Nie musisz dodawać  `wysokości linii` do każdego  `<p>`, `<h*>`, _et al_. osobno. Zamiast tego dodaj go do `body`:

translations/pt-BR/README.md

@@ -22,6 +22,7 @@ Uma coleção de dicas para aumentar suas habilidades no CSS.
 1. [Herde o `box-sizing`](#herde-o-box-sizing)
 1. [Use `unset` em vez de redefinir todas as propriedades](#use-unset-em-vez-de-redefinir-todas-as-propriedades)
 1. [Use `:not()` para Aplicar/Remover Bordas](#use-not-para-aplicarremover-bordas)
+1. [Verifique se a fonte está instalada localmente](#verifique-se-a-fonte-está-instalada-localmente)
 1. [Defina o `line-height` no `body`](#defina-o-line-height-no-body)
 1. [Definir `:focus` para elementos de formulário](#definir-focus-para-elementos-de-formulário)
 1. [Alinhe Elementos Verticalmente](#alinhe-elementos-verticalmente)
@@ -151,6 +152,32 @@ O seletor CSS define a borda da maneira que um humano a descreveria.
 <sup>[voltar ao índice](#Índice)</sup>
 
 
+### Verifique se a fonte está instalada localmente
+
+Você pode verificar se uma fonte está instalada localmente antes de buscá-la remotamente, o que também é uma boa dica de desempenho.
+
+```css
+@font-face {
+  font-family: "Dank Mono";
+  src:
+    /* Full name */
+    local("Dank Mono"),
+    /* Postscript name */
+    local("Dank Mono"),
+    /* Otherwise, download it! */
+    url("//...a.server/fonts/DankMono.woff");
+}
+
+code {
+  font-family: "Dank Mono", system-ui-monospace;
+}
+```
+
+Dica de chapéu para Adam Argyle por compartilhar este protip e [exemplo](https://codepen.io/argyleink/pen/VwYJpgR).
+
+<sup>[voltar ao índice](#Índice)</sup>
+
+
 ### Defina o `line-height` no `body`
 
 Você não precisa adicionar o `line-height` para cada `<p>`, `<h*>`, _et al_. separadamente. Apenas adicione ao `body`: