eigen fonts gebruiken
sitesite voor elkaar gekregen om aan de H1 - header een ander eigen lettertype te geven. Eerst had ik een manier waarin je IE en Firefox apart opgaf, dat werkte prima in IE en Firefox, maar weer niet in Chrome.
Toen had ik een algemene gevonden met de volgende code:
@font-face{
font-family: "splash";
src: url("/downloads/Splash.eot");
src: url("/downloads/SPLASH__.TTF") format("opentype"), url("/downloads/Splash.svg#Splash") format("svg");
Dit werkte prima in IE en Chrome, maar wordt niet door Firefox gepakt. *frusty*
Hieronder nog de code zoals ik hem in mijn stylesheet heb:
body {
font-size: .9em;
background: #61420A center url(../afbeeldingen/palmboom5.png) no-repeat;
font-family: gill sans light, metrodf, verdana, arial, "lucida console", sans-serif;
color: #333;
margin: 0;
padding: 0;
}
@font-face{
font-family: "splash";
src: url("/downloads/Splash.eot");
src: url("/downloads/SPLASH__.TTF") format("opentype"), url("/downloads/Splash.svg#Splash") format("svg");
verderop, waar ik het voor nodig had dus:
h1 {
font-family: splash;
text-align: center;
font-size: 1.5em;
Wat kan ik doen om te zorgen dat het OOK in Firefox gaat werken (opera heb ik niet, dus ik weet niet of het daar werkt)
Ik heb het met mijn Toen had ik een algemene gevonden met de volgende code:
@font-face{
font-family: "splash";
src: url("/downloads/Splash.eot");
src: url("/downloads/SPLASH__.TTF") format("opentype"), url("/downloads/Splash.svg#Splash") format("svg");
Dit werkte prima in IE en Chrome, maar wordt niet door Firefox gepakt. *frusty*
Hieronder nog de code zoals ik hem in mijn stylesheet heb:
body {
font-size: .9em;
background: #61420A center url(../afbeeldingen/palmboom5.png) no-repeat;
font-family: gill sans light, metrodf, verdana, arial, "lucida console", sans-serif;
color: #333;
margin: 0;
padding: 0;
}
@font-face{
font-family: "splash";
src: url("/downloads/Splash.eot");
src: url("/downloads/SPLASH__.TTF") format("opentype"), url("/downloads/Splash.svg#Splash") format("svg");
verderop, waar ik het voor nodig had dus:
h1 {
font-family: splash;
text-align: center;
font-size: 1.5em;
Wat kan ik doen om te zorgen dat het OOK in Firefox gaat werken (opera heb ik niet, dus ik weet niet of het daar werkt)
http://www.fontsquirrel.com/
Download de zip die je krijgt, kopieer de font bestanden naar jou map en kopieer de voorbeeld stylesheet naar jou stylesheet. Bewerk de paden naar de bestanden en de font naam en het werkt in, bijna elk, browser.
Gooi je .ttf bestand in de font-face generator van Download de zip die je krijgt, kopieer de font bestanden naar jou map en kopieer de voorbeeld stylesheet naar jou stylesheet. Bewerk de paden naar de bestanden en de font naam en het werkt in, bijna elk, browser.
De code die gebruikt wordt is nagenoeg hetzelfde volgens mij wordt dat ook meer gebruikt voor als je je standaardfont in je eigen font wil en niet zo zeer maar 1 type kopje.
Als ik mijn code @font-face vervang door die gegenereerde code, dan trekt hij mijn hele divs uit hun verband.