ugrás a tartalomhoz

CSS font importálás hogyan?

abraham · 2009. Már. 26. (Cs), 16.30
üdv,

tudna nekem valaki segíteni?
azt szeretném megoldani, hogy egy különleges betűtípussal tudnám használni a weboldalamat. pl a címsorokat ezzel írnám... ez a font ugye alapból nincs benne a windows-ba, úgyhogy importálni kellene.

így próbálkoztam, de nem ment:

<style type="text/css">
@font-face {
font-family: "eurofurence light";
src: url("../font/eurof.ttf");
} 
</style>

<h1 style="font-family: eurofurence light;">
Egyéb...</h1>
 
1

Böngésző

Poetro · 2009. Már. 26. (Cs), 16.46
Ugye a @font-face-t nem sok böngésző támogatja, tudtommal csak a Safari és az Opera legfrissebb verziói.
2

tehát sehogy nem tudom

abraham · 2009. Már. 26. (Cs), 17.08
tehát sehogy nem tudom megoldani, amit akarok?

felesleges szenvednem vele?
9

Font Face Replacement Embedding Techniques and Resources

Török Gábor · 2009. Már. 30. (H), 11.21
yaanno is pont most osztott meg egy tartalmat ebben a témakörben.
12

mármint a .ttf-et

Gixx · 2011. Május. 23. (H), 13.30
Mármint a .ttf-et nem támogatja mind. De a @font-face direktívát már igen.

Ha végképp nem megy, ajánom a "betű mókust" :) @fontface generator
3

vagy csak egy másik parancs

abraham · 2009. Már. 26. (Cs), 17.09
vagy csak egy másik parancs kell?
4

Dynamic Text Replacement

Zmetser · 2009. Már. 26. (Cs), 17.25
Leírás: http://www.alistapart.com/articles/dynatext
Demo: http://www.artypapers.com/csshelppile/pcdtr/#demo

Lényege, hogy PHP és Javascript segítségével képet csinál a szövegből, abban a betűtípusban amiben szeretnéd.
Előnyei, hogy nem szúrja el a szöveget JavaScript és képek nélkül sem, valamint szöveges böngészőben is jól jelenik meg.
5

köszi a megoldást! viszont ez

abraham · 2009. Már. 27. (P), 09.07
köszi a megoldást!
viszont ez nem jó, nekem a H1-es tag betűtípusához kellett volna. SEO szempontból meg ugye a H1-es tag-eknek nagy a szerepük, és ha ez képként van az oldalon, az elég siralom. De azért köszi, hátha valahol felhasználom!
6

Dehogynemjó!

sanyez · 2009. Már. 27. (P), 18.35
A nagy G van olyan intelligens, hogy kiválóan le tudja ezt kezelni és egyébként se "csak" kép az. Nézd csak meg még egyszer! ;)
7

utánanézek

abraham · 2009. Már. 28. (Szo), 10.57
na, akkor ennek utánanézek részletesebben is!
még egyszer köszönöm!
8

esetleg sifr

rrd · 2009. Már. 29. (V), 18.33
esetleg sifr
10

Így tökéletesen működik!

PeLa · 2011. Május. 22. (V), 01.13
Én is úgy kaptam ezt a leírást!

A következő kódot a CSS file eleéjére beszúrod.

@font-face {
font-family:"TWCen"; /* A TWCen helyére bármit írhatsz. Ez lesz a fontod neve*/
/* "ie" */
src: url("../fonts/TCB.EOT"); /*Az FTP-re fel kell másolni a fontfájlt és ide az elérési útvonalat kell beírni.*/
}
@font-face {
font-family:"TWCen";
/* "ff" */
src: url("../fonts/TCB.TTF") format("truetype");
}

Fontos lehet, hogy explorer alatt csak akkor fog működni, ha a fontfájlt eot kiterjesztésben is felteszed. Valahol van egyébként ttf to eot converter is.
Ha a fenti kód bekerült utána a megfelelő tag-eknél csak ezt a sort illeszted be:

font-family: "TWCen";

Így működnie kell.

TTF to EOT: http://ttf2eot.sebastiankippe.com/
13

Szia PeLa! Egy nagyon kezdő

Spilberg · 2012. Júl. 18. (Sze), 14.56
Szia PeLa!

Egy nagyon kezdő webes vagyok, de én is szeretném, ha weblapomon az általam választott betűtípussal jelenne meg a szöveg.

Addig értem, hogy létrehozok egy CSS fájlt.
Így néz ki:

@charset "UTF-8";
/* CSS Document */

@font-face {
font-family:"GsAvaGarBoo";

src: url("../font/GsAvaGarBoo.eot");
}
@font-face {
font-family:"GsAvaGarBoo";

src: url("../font/GsAvaGarBoo.ttf") format("truetype");
}

Mit szúrhattam el, valamit milyen nevet kell adni a fájlnak, ha azt szeretném, hogy amikor feltöltöm a szerverre, akkor ezt használja is a web.

Előre is köszi!!!
14

Példák

Poetro · 2012. Júl. 18. (Sze), 16.27
Nézz meg pár működő példát. A Google eleve szolgál jó sok példával, a Font Squirrel is ad neked komplett CSS-t, amit csak be kell illeszteni. Sőt, ha okosan csinálod, és licenceled a betűtípust (nehogy törvénysértést kövess el), akkor az oldal, ahonnan licenceled jó eséllyel szintén fog neked adni CSS darabkát, amit egyből tudsz használni.
11

font-face generator

asam9 · 2011. Május. 22. (V), 13.37
@font-face generator

sok munkától megszabadít :) /csak legyen olyan font, amit megeszik.../
15

Ez bevállik

Creative · 2012. Júl. 18. (Sze), 18.00
Szia

Nos, nekem ez a kombináció vállt be egy fonttal :) - de egyébként fon squirrel vagy typekit
@font-face {
	font-family: 'MyriadPro-Regular';
		src: url('../scripts/MyriadPro-Regular.eot');
		src: url('../scripts/MyriadPro-Regular.eot?#iefix') format('embedded-opentype'),
			 url('../scripts/MyriadPro-Regular.woff') format('woff'),
			 url('../scripts/MyriadPro-Regular.ttf') format('truetype'),
			 url('../scripts/MyriadPro-Regular.svg#MyriadPro-Regular') format('svg'),
			 local('☺');
		font-weight: normal;
		font-style: normal;
}
C.