PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
M

Ingesloten lettertype

Door Martijn Winters op 21-03-2019 13:35
5.057 views
IK heb een html pagina met woorden in verschillende fonts (lettertypes gedownload van internet). Maar als ik deze met een andere computer open zie ik geen fonts omdat de fonts niet geinstaleerd zijn op die computer. Is er een manier om die fonts toch te kunnen zien op de computer waar die fonts niet op geinstaleerd zijn? Zonder een font te moeten installeren. Hoe dit in mijn pagina moet toepassen?

<body>
<ul>
<li style="font-family:sans-serif;font-size:20px">Hond</li>
<li style="font-family:anthology Outline DEMO;font-size:20px">Paard</li>
<li style="font-family:Regular Fashion DEMO;font-size:20px">Zebra</li>
<li style="font-family:Back to Black Demo;font-size:20px">Poes</li>

</ul>
</body>
M
Martijn Winters
25-03-2019 13:25
Ik snap niet zo goed wat die aanhalingstekens een li kan onderscheiden?
- Ariën -
25-03-2019 13:27
Je kan toch een style per li-tag gebruiken? Of beter zelfs met een aparte class/id.
M
Martijn Winters
25-03-2019 13:33
Zou u aan de hand van mijn html even willen tonen hoe je dat het beste doet?
A
Adoptive Solution
25-03-2019 13:34 gewijzigd op 25-03-2019 13:38 
<style> 
@font-face {
	font-family: myFirstFont;
	src: url(Anthology-SansDEMO.ttf);
}

@font-face {
	font-family: mySecondFont;
	src: url(Anthology-OutlineDEMO.ttf);
}

li {
	font-family: myFirstFont;
	font-size: 20px;
}

.outline {
	font-family: mySecondFont;
	font-size: 20px;
	}
</style>

<ul>
	<li>Hond</li> 
	<li class="outline">Paard</li>
	<li>Zebra</li>
	<li>Poes</li>
</ul>

<p class="outline">En dit is Outline</p>


https://www.w3schools.com/css/tryit.asp?filename=trycss3_font-face_rule
- Ariën -
25-03-2019 13:34
Dat laat jij toch al zien? Je moet die fonts vooraf wel inladen.
M
Martijn Winters
25-03-2019 13:46
Ik heb 4 <li> dus ik veronderstel dat ik 4 @font-face moet hebben?
- Ariën -
25-03-2019 13:48
Ja, als je vier verschillende fonts wilt.
- Ariën -
25-03-2019 14:13 gewijzigd op 25-03-2019 14:15
De gedefinieerde 'mySecondFont' (Anthology-OutlineDEMO) gebruiken met een font-size van 20px
M
Martijn Winters
25-03-2019 14:17
Dus in mijn geval (4 fonts) myForthFont gebruiken ipv mySecondFont of blijft dit ongeacht hoeveel fonts je gebruikt?

Reageren

Inloggen om te reageren