Comment importer une police avec CSS

Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   -  
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,

J'aimerai savoir comment on importer une police avec CSS.

Merci d'avance,

Linda
A voir également:

10 réponses

Réponse 1 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
bonjour
vous pouver faire comme ca : 
@font-face {
    font-family: 'MaSuperPolice';
    src: url('MaSuperPolice.eot') format('eot'),
         url('MaSuperPolice.woff') format('woff'),
         url('MaSuperPolice.ttf') format('truetype'),
         url('MaSuperPolice.svg') format('svg');
0
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
}
0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
j'ai fait ce que tu m'as dis

@font-face {
font-family: 'Futura Light';
src: url('Futura Light.eot') format('eot'),
url('Futura Light.woff') format('woff'),
url('Futura Light.ttf') format('truetype'),
url('Futura Light.svg') format('svg');
}

mais rien ne change :-(
0
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
ha bizarre chez moi ca fonctionne, vous n'auriez pas oublier de la télécharger par hasard ou es ce que le chemin de l'url est bon?
0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
Ben le fichier de la font est dans bien sur mon bureau et je l'ai appelé futura...
0
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
futura ou Futura et je pense qu'il faut créer un dossier ou vous mettez votre fichier css ainsi que le fichier de la police, sur le bureau je sait pas si sa fonctionne!
ete vous sur que votre police est valable?
sur quel site l'avez vous telecharger?
0
Réponse 2 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
Le fichier de police (Futura Light.eot) doit ici être situé dans le même dossier que le fichier CSS (ou dans un sous-dossier si vous utilisez un chemin relatif).
0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
fontsquirrel.com ne fonctionne pas pour le moment... Bon je laisse tomber ça fait plus de 3h que je suis de dessus....
0
Réponse 3 / 10
abilify Messages postés 152 Date d'inscription   Statut Membre Dernière intervention   6
 
je pense que ca devrai fonctionner normalement je procède de la même façon
0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
ben ouii je comprends pas alors.... ben je sais pas comment prendre le fichier de ma police et de le mettre dans le dossier CSS
0
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
non a coter du fichier css dans le meme dossier.cote a cote
si vous creer un dossier police il faut rentrer le chemin
0
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
je m'explique mal desole
0
Réponse 4 / 10
txiki Messages postés 6596 Date d'inscription   Statut Contributeur Dernière intervention   521
 
C'est bon pour toi mais ce sera chez le client. Il devra lui aussi télécharger cette font. C'est pas terrible d'imposer une font qui n'est pas dans un système (Windows ou autre du reste).

Le bonheur est la seule chose que l'on peut donner sans l'avoir.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
ben je suis pas expert je me trompe peut être mais il me semblai que j'avais le résultat chez moi également quand je visionnai la page
et que le navigateur du client télécharge automatiquement la police, mais le problème c est que ce sont souvent des fichier assez lourd
je pense qu il y a une erreur car le résultat devrai être visible
0
Réponse 6 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
Certain format de police ne sont pas compatible avec tout les navigateur


.ttf : TrueType Font. Fonctionne sur IE9 et tous les autres navigateurs.
.eot : Embedded OpenType. Fonctionne sur Internet Explorer uniquement, toutes versions. Ce format est propriétaire de Microsoft.
.otf : OpenType Font. Ne fonctionne pas sur Internet Explorer
.svg : SVG Font. Le seul format reconnu sur les iPhone et iPad pour le moment.
.woff : Web Open Font Format. Nouveau format conçu pour le Web qui fonctionne sur IE9 et tous les autres navigateurs.
0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
j'ai meme essayé de le faire en chemin relatif
@font-face {
font-family: 'futura-light';
src:url("file://futura/futura-ligh.eot") format('eot'),
url("file://futura/futura-ligh.woff") format('woff'),
url("file://futura/futura-ligh.ttf") format('truetype'),
url("file://futura/futura-ligh.svg") format('svg');

}

mais rien n'y fait :-(
0
Réponse 7 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
bonsoir,
Pouvez vous envoyer la partie de votre code html et css concerner?
0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
@font-face {
font-family: 'FuturaLtCnBTLight';
src: url('futura-light-webfont.eot');
src: url('futura-light-webfont.eot?#iefix') format('embedded-opentype'),
url('futura-light-webfont.woff') format('woff'),
url('futura-light-webfont.ttf') format('truetype'),
url('futura-light-webfont.svg#FuturaLtCnBTLight') format('svg');
font-weight: normal;
font-style: normal;

}

body {
margin:0;
padding:50px;
font-family:FuturaLtCnBTLight,Verdana, Geneva, sans-serif;
width: 900px; /* par defaut il prend 100% alors je lui ai imposé une taille pr avoir un aperçus plus juste */
height: 825px;
}
0
Réponse 8 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
Bonjour es ce que le fichier de la police se trouve dans un dossier
dossier police = FuturaLtCnBTLight
fichier police = futura-light-webfont
si c est le cas il faut ecrire : 
@font-face { 
font-family: 'FuturaLtCnBTLight'; 
src: url('FuturaLtCnBTLight/futura-light-webfont.eot'); 
src: url('FuturaLtCnBTLight/futura-light-webfont.eot?#iefix') format('embedded-opentype'), 
url('FuturaLtCnBTLight/futura-light-webfont.woff') format('woff'), 
url('FuturaLtCnBTLight/futura-light-webfont.ttf') format('truetype'), 
url('FuturaLtCnBTLight/futura-light-webfont.svg#FuturaLtCnBTLight') format('svg'); 
font-weight: normal; 
font-style: normal; 

} 

body { 
margin:0; 
padding:50px; 
font-family:'FuturaLtCnBTLight',Verdana, Geneva, sans-serif; 
width: 900px; /* par defaut il prend 100% alors je lui ai imposé une taille pr avoir un aperçus plus juste */ 
height: 825px; 
}

et mettre les quotes quand vous appellez la police dans votre body
j espere que ce la va fonctionner
tenez moi au courant
bonne journee

0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
J'ai fait tout ce que tu m'as dit et ça ne fonctionne tjr pas :-(
0
Réponse 9 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
Moi j ai essayer avec un dossier police qui s 'appelle :PixieFont-fontfacekit
et un fichier police :PixieFont-webfont 

@font-face
        				
	{
        					
	font-family : "PixieFont-fontfacekit";
        						
        src :url("PixieFont-fontfacekit/PixieFont-webfont.eot");
        src :url("PixieFont-fontfacekit/PixieFont-webfont.svg");
        src :url("PixieFont-fontfacekit/PixieFont-webfont.ttf");
        src :url("PixieFont-fontfacekit/PixieFont-webfont.woff");
        					}
        h1
        	{
        		font-family : "PixieFont-fontfacekit";
        		text-align : center;
			color : red;
        	}


et ce code fonctionne
0
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
et celui ci nn plu je vien de le tester et il fonctionne chez moi
0
Lili_754 Messages postés 125 Date d'inscription   Statut Membre Dernière intervention   2
 
ben c bisar la je me demande si je l'ai bien installé...
0
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
 
essaye la retelecharger on c jamais ou avec une autre
0
Réponse 10 / 10
pascal_sevran Messages postés 159 Date d'inscription   Statut Membre Dernière intervention   6
  
@font-face
        				
	{
        					
	font-family : "PixieFont-fontfacekit";
        						
        src :url("FuturaLtCnBTLight/futura-light-webfont.eot");
        src :url("FuturaLtCnBTLight/futura-light-webfont.svg");
        src :url("FuturaLtCnBTLight/futura-light-webfont.ttf");
        src :url("FuturaLtCnBTLight/futura-light-webfont.woff");
        					}
        h1
        	{
        		font-family : "FuturaLtCnBTLight";
        		text-align : center;
			color : red;
0

Discussions similaires

Bref. Je cherche la police d'écriture de Bref
Ratus -
Calo mnie -

10 réponses
Police d'écriture Ricard
ponkie -
Mike-31 -

2 réponses
Quel police est utilisé dans le logo Cartier?
Ciboulette123 -
^^Marie^^ -

1 réponse
Menace "Interpol" après webcam coquine
diego34 -
Panth33ra -

4 réponses