Partage
  • Partager sur Facebook
  • Partager sur Twitter

Utilisation de @font-face

Utilisation d'une polie personnalisée

    18 janvier 2020 à 15:53:24

    Bonjour à tous,

    J'en suis au parargraphe "Entraînement au codage en trnasformant votre CV"

    J'ai réussi tous les exercices sauf celui où on me demande d'utiliser une nouvelle police via @font-face.

    J'ai téléchargé la polise Great Wishes dans dafont.com et je l'ai installée.

    Puis j'ai créé la partie du fichier CSS qui concerne cette action mais cela ne marche pas.

    Merci par avance de vos conseils

    Voici mon fichier CSS ci-dessous:

    h1

    {

    color: blue

    }

    h2

    {

    text-align: right

    }

    body

    {

        background: url("gerard_mini.jpg") fixed no-repeat, url("sanstitre.png") fixed;

    }

    @font-face

    {font-family: 'Great Wishes';

    src: url('Great Wishes.woff');

    }

    h2

    {

        border: 5px red solid;

    }

    h1

    {

        text-shadow: 2px 2px 4px black;

    • Partager sur Facebook
    • Partager sur Twitter
    Gérard LAFONT
      18 janvier 2020 à 16:26:59

      Bonjour

      Peux tu nos fournir une capture de ton dossier complet ? plus précisément le chemin de ta police.

      Évite de mettre des espaces dans le nom d'un fichier, utilise plutôt des underscore exemple : great_wishes.woff

      Ou encore camelCase exemple : greatWishes.woff

      -
      Edité par Mehddii 18 janvier 2020 à 16:30:27

      • Partager sur Facebook
      • Partager sur Twitter

      Postez votre code et vos msg d'erreurs - "ça marche pas" n'est pas un message d'erreur ...

        Staff 18 janvier 2020 à 16:30:46

        Bonjour,

        Merci de colorer votre code à l'aide du bouton Code

        Les forums d'Openclassrooms disposent d'une fonctionnalité permettant de colorer et mettre en forme les codes source afin de les rendre plus lisibles et faciles à manipuler par les intervenants. Pour cela, il faut utiliser le bouton Code de l'éditeur, choisir un des langages proposés et coller votre code dans la zone prévue. Si vous utilisez l'éditeur de messages en mode Markdown, il faut utiliser les balises <pre class="brush: xml;">Votre code ici</pre>.

        Liens conseillés


        Bonjour,

        >> J'ai téléchargé la polise Great Wishes dans dafont.com et je l'ai installée.

        Comment ça vous l'avez installée?? une police ne  s'installe pas en web, une fois vos fichiers sur le serveur la police ne serra pas installée sur le serveur. 

        1) il vous manque le format Ligne...  dans la déclaration de la police.(relisez cette partie du cours)

        2) sur quel élément appliquez vous cette police?

        3)  pas d'espace dans les noms de fichiers et de répertoire.

        -
        Edité par AbcAbc6 18 janvier 2020 à 16:32:02

        • Partager sur Facebook
        • Partager sur Twitter
          18 janvier 2020 à 18:02:37 - Message modéré pour le motif suivant : Merci d'utiliser le bouton code du forum pour insérer votre code


          Gérard LAFONT
            18 janvier 2020 à 18:08:21

            Tu n'a pas fermer ta parenthèse, ni ton point virgule.

            La syntaxe n'est pas la bonne !

            Voici un lien qui peut t'être utile : https://developer.mozilla.org/fr/docs/Web/CSS/@font-face

            Donc essayes plutôt :

            @font-face /* Définition d'une noeuvlle police nommée Great Wishes */
            
            {
            font-family: 'GreatWishes';
            
            src: url('greatwishes-webfont.eot'),
            
            url('greatwishes-webfont.woff'),
            
            url('greatwishes-webfont.ttf'),
            
            url('greatwishes-webfont.svg'),
            
            url('greatwishes-webfont.otf');
            
            }
            
            }

            Si ça marche pas, il nous faudrait une capture du chemin vers ta police

            • Partager sur Facebook
            • Partager sur Twitter

            Postez votre code et vos msg d'erreurs - "ça marche pas" n'est pas un message d'erreur ...

              2 février 2020 à 10:57:59

              OK.Merci.Cela fonctionne.

              Cordialement

              • Partager sur Facebook
              • Partager sur Twitter
              Gérard LAFONT
                Staff 2 février 2020 à 12:12:36

                Bonjour,

                Sujet résolu

                Tu peux passer le sujet à "résolu" (bouton en haut à droite du sujet) et cliquer sur les pouces levés des messages qui t'ont aidé⋅e ;)
                • Partager sur Facebook
                • Partager sur Twitter

                Utilisation de @font-face

                × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                • Editeur
                • Markdown