Entrer dans fonte particulier, nous pouvons personnaliser les titres, menus et textes de nos articles, afin de les rendre uniques sur le web.
Ajout d'une petite règle au fichier CSS : @ font-face.
Pour choisir notre police, qui doit être gratuite, on peut soit prendre celles déjà installées sur notre ordinateur, soit en chercher une sur Internet : un bon site c'est www.fontsquirrel.com, où vous trouverez une vaste gamme de polices !
Après avoir identifié notre police, pour la rendre compatible sur le web, rendez-vous sur la page '@font-face Generator', toujours sur www.fontsquirrel.com: ici, nous téléchargeons notre police, générons le package et le téléchargeons sur le PC. Dans ce package, nous trouverons la police divisée en 4 types, ce qui la rend compatible avec tous les principaux navigateurs.
Maintenant, téléchargeons le package sur le serveur et éditons notre fichier CSS :
@font-face { src: url('arial-webfont.eot'); src : local (' '), url('arial-webfont.woff') format ('woff'), url('arial-webfont.ttf') format('truetipe'), url('arial-webfont.svg #Arial') format('svg'); font-weight : normal ; style de police : normal ; }
En pratique, cette règle indique d'abord au navigateur de vérifier si la police existe sur l'ordinateur ; si elle n'est pas installée ici, la chaîne obligera le navigateur à charger la police avec l'extension correcte pour permettre sa visualisation !
Une autre solution est celle-ci :
@font-face { src: url(https://www.mywebsite.com/fonts/MyFontName.ttf); } p { }
Une fois le fichier MyFontName.ttf (exemple de police) inséré dans le dossier des polices de notre site, il est possible de visualiser la police nommée MyFontName ou bien si le navigateur ne supporte pas CSS3 la police Verdana.
Plus d'informations peuvent être trouvées ici http://www.w3.org/TR/css3-fonts/#the-font-face-rule.
Voici d'excellents Ă©diteurs CSS que vous pouvez utiliser :
- TopStyle
- Cascade de Balthisar
- CSS simple
