28112 sujets

CSS et mise en forme, CSS3

Salutations Smiley smile

Je lisais l’excellent article de Raphaël mais il n’y pas d’un petit paragraphe pour dire comment trouver les URL des Google fonts.

Mettons la Roboto il est donné ça comme code :
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto&display=swap" rel="stylesheet"> 


Dois-je en déduire ça comme code à insérer dans mon style.css :
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url("https://fonts.googleapis.com/css2?family=Roboto");
  font-display: swap;
}
@font-face {
  font-family: 'Roboto Condensed';
  font-style: normal;
  font-weight: 700;
  src: url("https://fonts.googleapis.com/css2?family=Roboto+Condensed");
  font-display: swap;
}


?

Merci.
Modifié par myself (22 Nov 2022 - 22:48)
Modérateur
Bonjour,

Si tu utilises des balises link pour charger tes polices, tu n'as pas besoin de mettre des @font-face dans le css. C'est soit des balises soit des @font-face, mais pas les deux (pour une police donnée).

Amicalement,
Meilleure solution
Ah ok ! En voilà une bonne nouvelle (sauf que je n’ai ni l’un ni l’autre : je vais devoir coder ça en dur dans mon template pour que ça soit dans le link).

Merci et bonne soirée Smiley cligne