Bonjour à toutes et à tous,
Utiliser une police personnalisée avec @font-face
Je place le fichier index.html dans le dossier travail.
Je place le fichier style.ccc dans un sous dossier du doossier travail.
Je télécharge, Learning-Curve-Pro-fontfacekit, sur font squirrel, et je l'installe.
Je fais de nombreux essais infructueux. J'ai utilisé d'autres police. Dans tous les cas,
je ne suis jamais parvenu à afficher la nouvelle police.
J'ai placé lla nouvelle police dans le dossier css (fichier stylesheet.css).
Voici une maquette dans laquelle, à titre de simplification, la nouvelle police est déclarée
dans le fichier style.css.
Index.html
Style.css
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16 <!doctype html> <html lang="fr"> <head> <meta charset="utf-8"> <title>Travail</title> <link rel="stylesheet" href="css/style.css"> <link rel="stylesheet" href="css/stylesheet.css"> <script type="text/javascript" src="sympa.js"> </script> </head> <body> <h1>Le travail c'est la santé<h1> <p>Le reste du contenu n'existe pas: c'est une maquette</p> </body> </html>
où est l'erreur*?
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21 @font-face { font-family: 'learning_curve_proregular'; src: url('LearningCurve_OT-webfont.eot'); src: url('LearningCurve_OT-webfont.eot?#iefix') format('embedded-opentype'), url('LearningCurve_OT-webfont.woff') format('woff'), url('LearningCurve_OT-webfont.ttf') format('truetype'), url('LearningCurve_OT-webfont.svg#learning_curve_proregular') format('svg'); font-weight: normal; font-style: normal; } p { font-size: 40px; } h1 { font-family: 'learning_curve_proregular', Arial, serif; font-size: 80px; }
Cordialement
Papy
Partager