1899
Ancien staff
- Inscription
- 10 Août 2012
- Messages
- 9 798
- Réactions
- 4 482
- Points
- 29 037
https://reality-gaming.fr/attachments/header-psd-png.65429/?temp_hash=ca59f08ce2d8ed87f93abf4cca9fa925
Bonjour à tous ,
Aujourd'hui je vais vous apprendre à intégrer une police personnalisé à votre site, c'est à dire une police autre que Arial, Tahoma, Trebuchet MS et les autres police installé de base.
https://reality-gaming.fr/attachments/separateur-orange-png.65430/?temp_hash=ca59f08ce2d8ed87f93abf4cca9fa925
Alors, pour ce faire, trouver une police hébergé sur internet et conçu pour internet, pour ma part je vais utiliser OpenSansCondensed, une police faite par google et hébergé sur les serveurs de google.
Cette police est notamment cette utilisé par RealityGaming, et elle n'est pas du tout difficile de l'installer comme toute les autres polices
Pour trouver vos polices, allez sur google font par exemple :
~
Dans votre balise <head> :
Bonjour à tous ,
Aujourd'hui je vais vous apprendre à intégrer une police personnalisé à votre site, c'est à dire une police autre que Arial, Tahoma, Trebuchet MS et les autres police installé de base.
https://reality-gaming.fr/attachments/separateur-orange-png.65430/?temp_hash=ca59f08ce2d8ed87f93abf4cca9fa925
Alors, pour ce faire, trouver une police hébergé sur internet et conçu pour internet, pour ma part je vais utiliser OpenSansCondensed, une police faite par google et hébergé sur les serveurs de google.
Cette police est notamment cette utilisé par RealityGaming, et elle n'est pas du tout difficile de l'installer comme toute les autres polices
Pour trouver vos polices, allez sur google font par exemple :
Vous devez être inscrit pour voir les liens ! Inscrivez-vous ou connectez-vous ici.
~
Dans votre balise <head> :
HTML:
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<title>Tutoriel</title>
</head>
Il va falloir intégrer le lien de la police dans la balise, à l'aide d'un code, le même pour rattacher un fichier .css au document html, c'est à dire :
Entre la balise href, mettez y le lien de votre police, pour ma part cela me donne ceci :
Et généralement, sur google font, vous avez directement la balise à intégrer dans votre <head>
Voici le code fini :
Code:
<link href=' ' rel='stylesheet' type='text/css'>
Entre la balise href, mettez y le lien de votre police, pour ma part cela me donne ceci :
Code:
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700,300italic' rel='stylesheet' type='text/css'>
Et généralement, sur google font, vous avez directement la balise à intégrer dans votre <head>
Voici le code fini :
HTML:
<head>
<meta charset="utf-8">
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700,300italic' rel='stylesheet' type='text/css'>
<title>Tutoriel</title>
</head>
https://reality-gaming.fr/attachments/separateur-orange-png.65430/?temp_hash=ca59f08ce2d8ed87f93abf4cca9fa925
Et maintenant pour l'utiliser, allez dans votre fichier css et ajouter :
Il faut l'ajouter à une class, tel que .titre, #titre, p, h3 etc...
Et maintenant pour l'utiliser, allez dans votre fichier css et ajouter :
Code:
font-family: 'Open Sans Condensed' sans-serif;
Il faut l'ajouter à une class, tel que .titre, #titre, p, h3 etc...
Code:
.shop {
font-size: 24px;
text-align: center;
font-family: 'Open Sans Condensed' sans-serif;
text-shadow: 0px 0px 3px black;
margin-right: 50px;
}
Tuto terminé, en espérant qu'il vous ai été utile