Liste Des Familles De Polices Javascript
ast Python module |
base64 Python module |
code Python module |
COM PHP module |
dis Python module |
Ev PHP module |
exp |
html Python module |
http Python module |
imp Python module |
io Python module |
JavaScript |
os Python module |
PS PHP module |
Python functions |
re Python module |
select Python module |
sep |
site Python module |
SPL PHP module |
StackOverflow |
time Python module |
UI PHP module
Michael Zippo
04.11.2021
La mise en forme du texte d`une page Web est une partie importante de la conception Web. Par exemple, vous pouvez souhaiter que les en-têtes apparaissent dans une police spécifique, ou que tout le texte d`une page utilise la police serif
.
C`est là que le CSS police est localisée : la famille entre en jeu. La propriété CSS font-family permet de spécifier une ou plusieurs familles de polices qui seront utilisées pour styliser le texte sur une page Web.
Ce tutoriel couvrira les bases en se référant à des exemples de CSS font-family et comment vous pouvez utiliser la propriété pour styliser du texte sur une page Web.
Famille de polices CSS
Il existe de nombreux aspects impliqués dans le style d`une police en CSS, de définir une couleur à la taille. la police. Cependant, l`une des parties les plus importantes d`un style de police consiste à définir la famille de polices, c`est-à-dire le style utilisé par le texte sur une page Web.
Définissez la famille de polices utilisée par le texte sur une page Web, vous pouvez utiliser la propriété font-family. La syntaxe de la propriété font-family est la suivante :
La propriété font-family accepte une seule police ou une liste de polices. Si vous spécifiez plus d`un caractère, vous devez séparer chaque caractère par une virgule.
L`ordre dans lequel les caractères sont affichés est l`ordre dans lequel le navigateur tentera d`appliquer les caractères. Le navigateur utilisera par défaut la première police de la liste qui est installée ou peut être téléchargée à partir du navigateur Web. Si ce caractère n`est pas disponible, le deuxième caractère sera utilisé, et ainsi de suite.
C`est important de noter que la propriété font-family sélectionnera une police pour chaque caractère dans un bloc de texte. Ensuite, si un caractère particulier n`est pas disponible dans une police, la police suivante de votre police dans la liste de famille sera essayée, jusqu`à ce qu`un caractère approprié puisse être trouvé.
Lorsque vous utilisez font-weight, il est il est préférable d`inclure au moins une police générique de nom de famille (telle que serif, sans-serif ou monospace). Cela garantit que si une autre police de la liste n`est pas disponible, le navigateur pourra toujours sélectionner une police pour le texte d`une page Web à afficher.
Il existe deux façons d`utiliser la propriété font-family. Tout d`abord, vous pouvez utiliser la propriété pour spécifier une police personnalisée pour une page Web. Deuxièmement, vous pouvez utiliser la propriété pour appliquer une famille de polices génériques au texte d`une page Web. Les familles de polices génériques pouvant être utilisées avec la propriété font-family sont les suivantes :
- serif : les polices utilisent la police serif (par exemple, Lucida Bright, Palladio).
- sans-serif : les polices utilisent la police sans-serif (par exemple, Open Sans, Trebuchet MS).
- monospace : les caractères ont tous la même largeur (par exemple, minivan, Menlo).
- italique : les caractères ont un trait d`union (ex. calligraphie Lucida).
- fantasy : polices décoratives utilisées pour attirer l`attention sur les polices (ex. Papyrus).
Il existe d`autres familles de polices génériques disponibles, que vous pouvez lire plus en détail dans Documentation sur la famille de polices CSS de Mozilla .
Maintenant que nous connaissons les bases de la propriété font-family, nous pouvons examiner quelques exemples de son fonctionnement en action .
Exemples de familles de polices CSS
Un timbre local a demandé à notre club, le Seattle Stamp Club, de personnaliser les polices pour certaines parties de leur site Web.
Tout d`abord, on nous a demandé de changer la police de tous les en-têtes
sur leur page "Contacts" pour utiliser le "Open Sans" Police de caractère. Ainsi, par exemple, le "Contactez-nous" sur la page "Contactez-nous" de leur site Web devrait apparaître dans Open Sans. Si cette police n`est pas disponible, la famille générique "sans-serif" doit être utilisée. Nous pourrions utiliser le code suivant pour ce faire :
Cliquez
" noscript>
bouton dans l`éditeur de code ci-dessus pour voir la sortie de notre code HTML/CSS .
Dans notre code HTML, nous avons spécifié un en-tête à l`aide d`une balise
qui contient le texte Contactez-nous
. Ainsi, dans notre code CSS, nous avons utilisé la famille de polices pour définir la police des éléments sur notre page Web.
La valeur que nous avons attribuée à la propriété font-family définit la police de tous les éléments
dans Ouvrez Sans
et, si cette police n`est pas disponible, la famille générique sans-serif
est utilisée. Pour ce faire, nous avons spécifié deux caractères, séparés par une virgule.
Supposons maintenant que l`on veuille aussi appliquer un style à tous les
éléments de la page Contacts
du club du tampon pour utiliser la police Times. Si cette police n`est pas disponible, une police serif par défaut doit être utilisée. Nous pourrions utiliser le code suivant pour ce faire :
Cliquez
< noscript> 24" dans l`éditeur de code ci-dessus pour voir la sortie de notre code HTML/CSS.
Dans notre exemple, nous avons déclaré un paragraphe de texte à l`aide d`une balise
. Ensuite, nous définissons la famille de polices de toutes les balises
de notre feuille de style CSS pour utiliser les balises Times
et serif
. Par défaut, le navigateur essaiera d`afficher toutes les balises
dans la police Times
. Si cette police n`est pas disponible, la police serif
la police est utilisée.
La propriété CSS font-family permet de spécifier le style du texte d`une page web. Par exemple, vous pouvez utiliser la propriété font-family pour utiliser la propriété de police " Arial " ou la police générique " Italic " pour tout le texte d`une page Web.
Ce tutoriel expliqué, en se référant aux exemples, les bases de la propriété CSS font-family et comment vous pouvez l`utiliser pour styliser le texte d`une page Web. Vous êtes maintenant prêt à commencer à utiliser la propriété de la famille de polices comme un concepteur Web expert !