[CSS] Hoe fontgrootte definieren? - Softwareontwikkeling

woensdag 1 augustus 2007 12:14

Acties:

Verwijderd

Topicstarter

Als ik wil aangeven welke fontgrootte een bepaald element moet hebben, zijn er verschillende technieken hiervoor:

font-size: 10px
font-size: 10pt
font-size: 80%
font-size: 1.5em

Mjin vraag is: welke methode gebruik je in welk geval en hoe verhouden deze methoden zich tot elkaar (dus: hoeveel px is 1 em, etc)?

woensdag 1 augustus 2007 13:16

Acties:

OkkE

CSS influencer :+

Het is voor een deel afhankelijk van je eigen voorkeur denk ik. Hier is een uitleg: How Do I Size Fonts?

Persoonlijk gebruik ik altijd % op de <body> om alle fonts iets kleiner te maken, en daarna de pt methode. Soms gebruik ik de em methode, maar dat is vooral handig omdat deze relatief aan het parent element is.

Ik zet het font nooit in px omdat de tekst dan in Internet Explorer niet kan worden veranderd.

-- edit --

Het is niet echt makkelijk te zeggen dat 1em == ??px. Vanwegen het feit dat % en em relatief zijn, en px & pt "vaste" waardes. Zie het zo; je kunt onmogelijk zeggen dat 50% v/d hoogte van een willekeurig huis altijd 5 meter is.

[ Voor 18% gewijzigd door OkkE op 01-08-2007 13:19 ]

“The best way to get the right answer on the Internet is not to ask a question, it's to post the wrong answer.”
QA Engineer walks into a bar. Orders a beer. Orders 0 beers. Orders 999999999 beers. Orders a lizard. Orders -1 beers.

woensdag 1 augustus 2007 14:04

Acties:

Savantas

Handigste is om de body op een bepaalde waarde in px of pt te zetten, en de rest relatief hiervan met behulp van em. Dan kan je pagina nog prima geschaald worden. Alleen voor tekst in tabellen moet je extra definieren, omdat die zich niets aan lijkt te trekken van de default grootte.
(Zo uit blote hoofd, correct me if i'm wrong...)

Ik denk niet zwart-wit, ik denk diapositief! ( ͡° ͜ʖ ͡°)

woensdag 1 augustus 2007 14:26

Acties:

pderaaij

In het boek "Bulletproof Webdesign" zet men in de body het volgende neer:

code:

1	font-size: x-small / small

en voor de rest werkt men met procenten.

Deze methode gebruik ik zelf ook. Werkt bijna altijd goed alhoewel IE en FF niet altijd dezelfde interpretatie van de % hebben.

woensdag 1 augustus 2007 17:40

Acties:

sky-

qn nna 👌

Ik gebruik in de body tag altijd px, en voor de rest em.

Dus bijv mijn bodytag px zijn 12, dan gebruik ik voor h1 bijv 2em; ofzo

.

don't be afraid of machines, be afraid of the people who build and train them.

woensdag 1 augustus 2007 17:51

Acties:

Verwijderd

De pt eenheid is onzinnig voor het beeldscherm. Die gebruik je alleen voor media waarvan je het formaat kent. Bijvoorbeeld een A4-tje. Ook cm, mm, pc en in gebruik je niet voor beeldschermen.

Wil je controle hebben over de exacte grootte van je letters, dan neem je voor een beeldscherm px, en voor printversies pt (of cm, mm, pc of in). Kan het je niet zoveel schelen (lees: je laat het aan de eindgebruiker over) gebruik je procenten of x-small en dergelijke.

De em/ex eenheden moet je eigenlijk niet gebruiken om de lettergrootte mee aan te geven, daar heb je x-small, small en de percentages voor. De em/ex eenheden gebruik je vooral voor marges, inspringen, dat soort dingen. En dat doe je dus zowel op media met vast formaat, als op media met onbekend formaat.

[edit]
Meer duidelijkheid:

1em is de lettergrootte.
1ex is de hoogte van de letter "x" in de lettergrootte.
De standaard regelhoogte is 1.2 keer de lettergrootte.

1pt is 1/72 inch
1in is 2.54cm
De grootte van de projectie van een beeldscherm is onbekend. Je kunt wel het aantal pixels bepalen, maar als je niet weet hoeveel pixels er in een inch gaan, weet je dus niet over de absolute grootte. En daarom dus nooit cm, mm, in, pt of pc gebruiken voor media met onbekende afmetingen!

De rest is helder lijkt me.

[ Voor 25% gewijzigd door Verwijderd op 01-08-2007 18:00 ]