Forcer l'intégration d'une police sur un site Internet

Résolu/Fermé

crl22 Messages postés 9 Date d'inscription samedi 19 octobre 2013 Statut Membre Dernière intervention 18 octobre 2014 - 10 sept. 2014 à 15:49
crl22 Messages postés 9 Date d'inscription samedi 19 octobre 2013 Statut Membre Dernière intervention 18 octobre 2014 - 12 sept. 2014 à 14:03

Bonjour à tous,

Je souhaite utiliser la police Roboto dans un site Internet mais celle-ci n'est pas prise en compte par un ordinateur classique, hormis si l'on possède la police sur son propre poste.

Comment faire pour forcer l'utilisation de cette police, comme le fait le site de surf de l'ASP World Tour par exemple ?

Merci d'avance,

A voir également:

Forcer l'intégration d'une police sur un site Internet
Site de telechargement - Accueil - Outils
Forcer demarrage pc - Guide
Forcer la suppression d'un fichier - Guide
Site comme coco - Accueil - Réseaux sociaux
Url site internet - Guide

4 réponses

Réponse 1 / 4

Utilisateur anonyme
Modifié par -Nabster- le 10/09/2014 à 16:09

Salut,

Facile, tu met la police en question sur ton FTP, puis tu déclare le chemin avec la fonction @font-face, exemple :

@font-face {
font-family: 'Roboto';
src: url('(racine_de_ton_ftp)/police/Roboto.tff');
}

Puis après au niveau du CSS ça se déclare normalement, exemple :


#roboto{  
font-family: 'Roboto', sans-serif;
}

Réponse 2 / 4

crl22 Messages postés 9 Date d'inscription samedi 19 octobre 2013 Statut Membre Dernière intervention 18 octobre 2014
10 sept. 2014 à 16:26

Voici le code source de ma page : view-source:http://www.usmeilleraiefoot.fr/

J'ai essayé une intégration via la font Google mais ça n'a pas l'air concluant...

Réponse 3 / 4

inspiring Messages postés 1813 Date d'inscription vendredi 28 janvier 2011 Statut Membre Dernière intervention 31 décembre 2018 265
Modifié par inspiring le 10/09/2014 à 21:28

Bonjour,

ça fonctionne, tu es bien en Roboto.
Par contre ton code est trop lourd. Tu n'as pas besoin d'appeller font-family dans chaque règle css, juste dans l'élément parent.
Tu as des règles CSS dupliqué (surement entre code du head et feuille externe)

Ecrit et assumé par Inspiring - copyright 2009-2014

Réponse 4 / 4

crl22 Messages postés 9 Date d'inscription samedi 19 octobre 2013 Statut Membre Dernière intervention 18 octobre 2014
11 sept. 2014 à 11:05

Parfait, ça fonctionne pour la police Roboto !

Par contre, j'ai une partie en Roboto Cn qui n'est pas prise en compte. Saurais-tu comment faire pour l'intégrer elle aussi ?

Merci d'avance,

Utilisateur anonyme
11 sept. 2014 à 11:08

Si tout n'est pas en Roboto c'est que tu as une autre font-family quelque part ;)

crl22 Messages postés 9 Date d'inscription samedi 19 octobre 2013 Statut Membre Dernière intervention 18 octobre 2014
11 sept. 2014 à 11:10

Dans le CSS de ma page ?

Utilisateur anonyme
Modifié par -Nabster- le 11/09/2014 à 11:14

Oui, dans ton fichier css quoi.

crl22 Messages postés 9 Date d'inscription samedi 19 octobre 2013 Statut Membre Dernière intervention 18 octobre 2014
11 sept. 2014 à 11:31

Je suis désolé mais je ne vois pas trop ce que tu veux dire...

crl22 Messages postés 9 Date d'inscription samedi 19 octobre 2013 Statut Membre Dernière intervention 18 octobre 2014
12 sept. 2014 à 14:03

Voici le code de mon fichier CSS :


@charset "UTF-8";
*|* {
}
*|img {
  border-style: none;
}
*|body {
  margin: 0;
  padding: 0;
  font-family: Roboto;
  background-color: #ffffff;
}
*|#page {
}
*|#page-header {
  border-bottom: 1px solid black;
  padding-top: 1em;
  padding-bottom: 1em;
  width: 100%;
  text-align: center;
  background-image: url(../img/header-background.png);
  background-repeat: repeat-x;
}
*|#page-header-body {
  width: 900px;
  margin-left: auto;
  margin-right: auto;
  text-align: left;
}
*|#page-header *|.title {
  color: white;
  font-size: 4em;
  font-weight: bold;
}
*|#page-header *|p {
  font-size: 1.2em;
}
*|#page-body {
  margin: 1em auto;
  width: 900px;
  text-align: left;
}
*|#page-footer {
  width: 100%;
  padding-top: 1.5em;
  padding-bottom: 1em;
  text-align: center;
  float: left;
}
*|#page-footer-body {
  width: 900px;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
  font-size: 0.8em;
}
*|#volver {
  float: right;
  padding-left: 24px;
  background-image: url(../img/back.png);
  background-repeat: no-repeat;
  background-position: 0 center;
  line-height: 24px;
  font-size: 1.2em;
}
*|#volver *|a {
  text-decoration: none;
}
*|pre.escaped {
  padding: 12px 10px;
  overflow: auto;
  display: block;
  -moz-border-radius-topleft: 10px;
  -moz-border-radius-topright: 10px;
  -moz-border-radius-bottomleft: 10px;
  -moz-border-radius-bottomright: 10px;
  background-color: #f9f9f9;
  font-size: 12px;
}

Remarques-tu certaines anomalies au niveau des polices ?

Merci,

Discussions similaires

C'est quoi le site qui remplace coco chat