Je souhaite utiliser une seule police nommée "Algérien" sur tout mon site Web. Donc, je dois changer toutes les balises HTML et je ne veux pas écrire de code différent pour différentes balises comme:
button{font-family:Algerian;}
div{font-family:Algerian;}La méthode écrite ci-dessous est également fortement déconseillée:
div,button,span,strong{font-family:Algerian;}Réponses:
Mettez la font-familydéclaration dans un bodysélecteur:
body {
font-family: Algerian;
}Tous les éléments de votre page hériteront alors de cette famille de polices (à moins, bien sûr, que vous ne la remplaciez plus tard).
font-familyde son parent que lorsqu'aucune feuille de style ne définit la famille de polices de l'élément. Feuilles de style du navigateur généralement mis en famille de polices au moins input, textarea, code, ttet des preéléments.
*{font-family:Algerian;}meilleure solution ci-dessous Appliquer une seule police à un site Web entier avec CSS
Le sélecteur universel *fait référence à tous les éléments, ce css le fera pour vous:
*{
font-family:Algerian;
}Mais malheureusement, si vous utilisez des icônes FontAwesome ou des icônes nécessitant leur propre famille de polices, cela détruira simplement les icônes et elles n'afficheront pas la vue requise.
Pour éviter cela, vous pouvez utiliser le :notsélecteur, un exemple d'icône fontawesome <i class="fa fa-bluetooth"></i>, donc vous pouvez simplement utiliser:
*:not(i){
font-family:Algerian;
}cela appliquera cette famille à tous les éléments du document à l'exception des éléments avec le nom de la balise <i>, vous pouvez également le faire pour les classes:
*:not(.fa){
font-family:Algerian;
}cela appliquera cette famille à tous les éléments du document à l'exception des éléments avec la classe "fa" qui se réfère à la classe par défaut fontawesome, vous pouvez également cibler plus d'une classe comme ceci:
*:not(i):not(.fa):not(.YourClassName){
font-family:Algerian;
}* { font-family: Algerian; }Le sélecteur universel *fait référence à n'importe quel élément.
Comme une police différente est susceptible d'être déjà définie par le navigateur pour les éléments de formulaire, voici 2 façons d'utiliser cette police partout:
body, input, textarea {
font-family: Algerian;
}
body {
font-family: Algerian !important;
}Il y aura toujours une police monospace sur des éléments comme pre / code, kbd, etc. mais, si vous utilisez ces éléments, vous feriez mieux d'utiliser une police monospace là-bas.
Remarque importante: si très peu de personnes ont cette police installée sur leur système d'exploitation, la deuxième police de la liste sera utilisée. Ici, vous n'avez défini aucune deuxième police, donc la police serif par défaut sera utilisée, et ce sera Times, Times New Roman sauf peut-être sous Linux.
Deux options ici: utilisez @ font-face si votre police est libre d'utilisation en tant que police téléchargeable ou ajoutez des solutions de secours: une seconde, une troisième, etc. et enfin une famille par défaut (sans-serif, cursive (*), monospace ou serif). Le premier de la liste qui existe sur le système d'exploitation de l'utilisateur sera utilisé.
(*) La cursive par défaut sous Windows est Comic Sans. Sauf si vous voulez troller les utilisateurs de Windows, ne faites pas ça :) Cette police est terrible sauf pour les anniversaires de vos enfants où elle est la bienvenue.
Ok, donc j'avais ce problème où j'ai essayé plusieurs options différentes.
La police que j'utilise est Ubuntu-LI, j'ai créé un dossier de polices dans mon répertoire de travail. sous le dossier polices
J'ai pu l'appliquer ... finalement voici mon code de travail
Je voulais que cela s'applique à l'ensemble de mon site Web, alors je l'ai mis en haut de la doc css. au-dessus de toutes les balises Div (peu importe, sachez simplement que toutes les polices individuelles que vous attribuez après votre script auront la priorité)
@font-face{
font-family: "Ubuntu-LI";
src: url("/fonts/Ubuntu/(Ubuntu-LI.ttf"),
url("../fonts/Ubuntu/Ubuntu-LI.ttf");
}
*{
font-family:"Ubuntu-LI";
}Si je voulais ensuite que toutes mes balises H1 soient quelque chose d'autre, disons sans sarif, je ferais quelque chose comme
h1{
font-family: Sans-sarif;
}A partir de quel cas seules mes balises H1 seraient la police sans-sarif et le reste de ma page serait la police Ubuntu-LI
*{font-family:Algerian;}ce html a fonctionné pour moi. Ajouté aux paramètres de canevas dans wordpress.
Ça a l'air cool - merci!