web-dev-qa-db-fra.com

Police par défaut définie sur Android

Quelqu'un peut-il me dire quelles sont les polices fournies sur la plupart des appareils Android, en particulier pour les pages Web?

Tout comme Windows a ses polices groupées ou listes de polices Mac , quelles sont les polices qui viennent avec la plupart Android téléphones et tablettes Android? Quelqu'un peut-il pointer vers une liste sur le web?

Je fais des pages Web et je veux configurer mon CSS pour qu'il se dégrade gracieusement de l'utilisation de polices plus récentes à des familles de polices "sans-serif" et "serif". THX.

30
Amy

Développer sur réponse de Grstmo :

system_fonts.xml définit le mappage de la famille de polices aux fichiers de polices réels. Essayons donc ces derniers:

<div style="font-family: sans-serif; font-style: normal">Regular</div>
<div style="font-family: sans-serif; font-style: italic">Italic</div>
<div style="font-family: sans-serif; font-weight: bold">Bold</div>
<div style="font-family: sans-serif; font-weight: bold; font-style: italic">Bold-italic</div>

<div style="font-family: sans-serif-light; font-style: normal">Light</div>
<div style="font-family: sans-serif-light; font-style: italic">Light-italic</div>

<div style="font-family: sans-serif-thin; font-style: normal">Thin</div>
<div style="font-family: sans-serif-thin; font-style: italic">Thin-italic</div>

<div style="font-family: sans-serif-condensed; font-style: normal">Condensed regular</div>
<div style="font-family: sans-serif-condensed; font-style: italic">Condensed italic</div>
<div style="font-family: sans-serif-condensed; font-weight: bold">Condensed bold</div>
<div style="font-family: sans-serif-condensed; font-weight: bold; font-style: italic">Condensed bold-italic</div>

<div style="font-family: serif; font-style: normal">Serif Regular</div>
<div style="font-family: serif; font-style: italic">Serif Italic</div>
<div style="font-family: serif; font-weight: bold">Serif Bold</div>
<div style="font-family: serif; font-weight: bold; font-style: italic">Serif Bold-italic</div>

<!-- "Droid Sans" actually gives you Roboto. -->
<div style="font-family: &quot;Droid Sans&quot;; font-style: normal">Droid Sans Regular</div>
<div style="font-family: &quot;Droid Sans&quot;; font-weight: bold">Droid Sans Bold</div>

<div style="font-family: monospace; font-style: normal">Monospace Regular</div>

http://jsfiddle.net/9z3tD/4/ => screenshot on 4.2 (testé sur Android 4.2)

EDIT: "Droid Sans" dans la capture d'écran est clairement Roboto. La configuration le supporte mais s'avère le fichier sous-jacent est un lien sim : DroidSans.ttf -> Roboto-Regular.ttf, DroidSans-Bold.ttf -> Roboto-Bold.ttf

EDIT: Peu importe que je cite les noms de famille ( http://jsfiddle.net/9z3tD/9/ rend les mêmes). CSS distingue les mots clés génériques comme serif et les guillemets "serif" Qui font référence à une police dont le nom se trouve être "serif"; mais la configuration xml ne fait aucune distinction, donc je devinez dans Android l'une ou l'autre syntaxe fait référence à une police dont le nom est "serif". Mais là peut faire la différence si vous créez une WebView personnalisée et la configurez pour mapper des mots-clés génériques à d'autres polices ( setSerifFontFamily() et amis).

Ensuite, il y a fallback_fonts.xml . Ceux-ci n'ont pas de noms; par exemple. vous NE POUVEZ PAS dire font-family: "Droid Sans Fallback".
Mais tous sont censés être essayés pour chaque glyphe manquant dans d'autres polices. Vraisemblablement, on peut même choisir un sous-ensemble en utilisant font-variant De "elegant" Ou "compact" Et en définissant le texte lang="ja"?
Cependant, je ne vois pas du tout utiliser Droid Sans Fallback, donc les solutions de secours ne fonctionnent peut-être pas dans WebKit :


Avis de non-responsabilité: ce qui précède s'applique au stock Android, à l'aide du navigateur de stock et/ou de Chrome. I croyez il s'applique également à WebView (avec la configuration par défaut) mais n'a pas été testé.

En théorie, les fabricants peuvent utiliser d'autres polices, par exemple J'ai entendu des rumeurs selon lesquelles Samsung le ferait. Dans la pratique --- (captures d'écran sur tous les appareils Android que BrowserStack avait tous - y compris les Samsung - regardez mes yeux inexpérimentés pour être Roboto ou Droid, les différences étant simplement Android versions ... Cependant, voici Galaxy S3 pris sans aliasing Georgia à serif donc quelque chose diffère.

Firefox est un bon exemple d'un navigateur qui le fait différemment - ils sont passés à Open Sans et Charis SIL Compact , puis - remplacé Open Sans par Clear Sans .
La configuration complète est en libpref/init/all.js et dépend de la langue.
Pour autant que je sache, Firefox ne tient pas compte des alias de system_fonts.xml, par ex. Georgia donne une police sans.
OTOH, anciennes versions (testées 30, 34) vous permettait de faire référence aux polices système par leur nom, même à Droid Sans Fallback mais cela ne fonctionne pas sur FF 36 , 37 (ces 2 résultats sont pour http://codepen.io/cben/pen/VYgPEE , l'utilisation d'AdobeBlank signifie que lorsque vous voyez des caractères, cette police a été utilisée).


Voir aussi réponse pertinente sur les polices disponibles pour les applications.

29

Cela a été répondu ici: Comment récupérer une liste des polices disponibles/installées dans Android? Il n'y a que 3 polices disponibles dans le cadre d'Android; normal (Droid Sans), serif (Droid Serif) et monospace (Droid Sans Mono).

3
David

Depuis Android 4.1 vous pouvez utiliser ceci par exemple:

famille de polices: sans-serif-light;

3
Grsmto

http://www.granneman.com/webdev/coding/css/fonts-and-formatting/default-fonts/#Android

Apparemment, il n'y a que 3 polices que vous pouvez spécifier sur la version antérieure à Android 4.0:

  • Droid Sans
  • Droid Serif
  • Droid Sans Mono

Je suppose qu'ils se traduisent par ceux CSS par défaut (c'est-à-dire sans-serif, serif, mono)

1
gcb

Post 4.0 Androïd utilise la police "Roboto". Vous pouvez trouver les spécifications d'Androïd ici: http://developer.Android.com/design/style/typography.html

0
laurent xenard

Comme j'ai été testé pendant un certain temps, il existe 3 polices standard - types de famille pour WebView:

serif, sans-serif, monospace. J'ai chargé comme ceci avec javaScript (j'ai essayé différentes combinaisons de http://www.w3schools.com/cssref/css_websafe_fonts.asp où était placé le tableau des combinaisons couramment utilisées):

myWebView.loadUrl("javascript:document.body.style.fontFamily=\"Impact, Charcoal, sans-serif\";");

donc, il n'y avait aucune différence avec le code ci-dessous:

myWebView.loadUrl("javascript:document.body.style.fontFamily=\"sans-serif\";");

J'ai le même résultat. Testé le 4.2.2.

Étrange mais le courrier fonctionne également, ressemble à une sorte de monospace.

0
Penzzz