Ga naar inhoud
TextArray
100% lokaal

CSS-eenheidconverter

Converteer CSS-lengtes tussen px, rem, em, pt en% tegen elke hoofdlettergrootte.

Invoer
Uitvoer

CSS-eenheidconverter

Plak CSS-waarden één per regel (16px, 1.5rem, 12pt, 150%) en deze converter vertaalt ze onmiddellijk. Een kaal getal wordt gelezen in de eenheid die is ingesteld door de From select, terwijl een eenheid die in de regel is geschreven altijd wint, zodat u pixels en rems in één lijst kunt combineren. Kies een doel onder Aan, of kies Alle eenheden om de hele keten in één oogopslag te zien: 16px = 1rem = 12pt = 100%. Regels die geen gewone waarden zijn, gaan onveranderd door, dus een verdwaalde opmerking onderbreekt nooit de run.

De wiskunde hangt af van één getal: de basisgrootte, de hoofdlettergrootte in pixels. Browsers zijn standaard ingesteld op 16px. Daarom is 1rem meestal gelijk aan 16px en is 100% gelijk aan de basis. Stel de basis in op 10 voor de klassieke 62,5%-truc waarbij 1,5rem 15px is, of match een ontwerpsysteem met een andere root. Punten worden door CSS zelf vastgesteld: 1px is 1/96 inch en 1pt is 1/72, dus 16px is precies 12pt, ongeacht de basis. De optie voor decimalen beperkt de nauwkeurigheid tot maximaal zes plaatsen, waarbij de afsluitende nullen worden bijgesneden.

Rem is de toegankelijkheidsvriendelijke eenheid: het schaalt mee met de browservoorkeur voor de lettergrootte van de browser, zodat de tekst die in rem wordt ingesteld groeit wanneer iemand de standaardgrootte verhoogt, terwijl px onveranderd blijft. Em gebruikt hier dezelfde wiskunde, maar in een echt stylesheet is het relatief ten opzichte van de eigen lettergrootte van het element, dus geneste em-waarden zijn samengesteld waar rem dat niet doet - deze converter gaat uit van het platte, root-relatieve hoofdlettergebruik.

Alles draait lokaal in uw browser; er wordt niets geüpload en er is niets om op te wachten. Kopieer de geconverteerde lijst of download deze als .txt-bestand.

FAQ

Waarom rem gebruiken in plaats van px?
Rem-waarden schalen met de lettergrootte die de lezer in zijn browser instelt, zodat mensen die grotere tekst nodig hebben, deze ook daadwerkelijk krijgen. Px-waarden negeren die voorkeur. Het converteren van een px-gebaseerd ontwerp naar rem is een van de goedkoopste toegankelijkheidsvoordelen die er zijn.
Wat is de basisgrootte en waarom is deze standaard 16?
Het is de hoofdlettergrootte in pixels – waar 1rem, 1em en 100% naar verwijzen. Elke grote browser wordt geleverd met een standaardwaarde van 16px, dus 16 is de juiste basis, tenzij uw stylesheet de root wijzigt, bijvoorbeeld html {font-size: 62,5% }, wat de basis 10 maakt.
Wat is het verschil tussen em en rem?
Rem is altijd relatief ten opzichte van de hoofdlettergrootte; em is relatief ten opzichte van het huidige element, dus geneste em-waarden vermenigvuldigen zich. Deze converter behandelt beide tegen de enkele basisgrootte: de platte behuizing. Bij diep geneste markup kunnen echte em-waarden verschillen.
Wat gebeurt er met lijnen die geen waarden zijn?
Ze gaan onveranderd door naar de uitgang en de telling telt ze als overgeslagen. Alleen gewone waarden zoals 16px, 1.5rem of een kaal getal worden geconverteerd; volledige CSS-declaraties vallen buiten het bereik.
Wordt mijn tekst ergens geüpload?
Nee. De tool draait volledig in uw browser en uw invoer verlaat nooit uw apparaat.