CSS vienību konvertēšana ir process, kurā tiek pārveidotas dažādas garuma vienības (px, em, rem, %, vw, vh utt.), ko izmanto tīmekļa dizainā.
Absolūtās un relatīvās vienības
CSS vienības plaši iedalās absolūtajās un relatīvajās. Absolūtās vienības (px, pt, cm utt.) ir fiksētas, bet relatīvās (em, rem, %, vw, vh utt.) tiek izteiktas kā attiecība pret bāzes vērtību.
px (Pikselis)
Visizplatītākā vienība, kas apzīmē vienu punktu uz ekrāna. Vieglāk pārvaldāma dēļ fiksēta izmēra, bet var radīt pieejamības problēmas, jo ignorē lietotāja fonta iestatījumus.
em (Em)
Relatīvā vienība, kas balstīta uz vecākā elementa fonta izmēru. 1em = vecāka font-size. Iegultās struktūras var izraisīt kumulatīvas ietekmes un negaidītus izmērus.
rem (Root Em)
Relatīvā vienība, kas balstīta uz saknes (html) fonta izmēru. 1rem = html font-size (parasti 16px). Atšķirībā no em neietekmē iegulšana un ieteicama mūsdienu CSS.
% (Procenti)
Attēlo proporciju pret vecāka elementa izmēru. Font-size gadījumā tas balstās uz vecāka font-size; platuma gadījumā – uz vecāka platumu. Bāze atšķiras pēc īpašības.
vw/vh (Viewport vienības)
Vienības, kas balstītas uz skata laukuma izmēru. 1vw = 1% no viewport platuma, 1vh = 1% no viewport augstuma. Nodrošina elastīgus izkārtojumus, kas reaģē uz ekrāna izmēru.
pt/pc (Drukas vienības)
Vienības, ko izmanto drukas nozarē. 1pt = 1/72 collas, 1pc = 12pt. Izmanto drukas CSS un PDF ģenerēšanā; ekrānā parasti lieto px vai rem.
Fiziskās vienības (cm/mm/in)
Vienības, kas apzīmē reālu fizisku garumu. 1in = 2.54cm = 25.4mm = 96px (CSS definīcija). Izmanto, ja nepieciešama saskaņa ar drukātajiem materiāliem, bet ekrāna fiziskais izmērs nav garantēts.
Reāllaika konversijas priekšrocības
Šis rīks atbalsta reāllaika konversiju un nekavējoties atjaunina rezultātus, mainot bāzes vērtības. Ļauj ātri pārbaudīt izskatu dažādos ekrāna izmēros un fontu iestatījumos.