Joan eduki nagusira
LibraTool logoLibraTool

Pixel REM Bihurgailua doan

Bihurtu px, rem, em, pt, vw, vh eta % artean oinarri-letra-tamaina konfigurargarriarekin. Pixel-tamaina arrunten erreferentzia-taula barne.

Linez kanpo funtzionatzen du behin kargatuta
1rem

Testuingurua (rem/em/vw/vh/% eragiten du)

16 px-rako bihurketak guztiak

Hurbilena Tailwind ongileak (16px erroan)

Pikselen tamaina arruntak → rem (16px oinarrian)

Bihurtu itsatsitako CSS

Ohiko erabilerak

  • PX-tik REM-ra Webaren GarapeneanBihurtu pixel-balioak rem-unităteetan CSS hazgarri eta atzipenean. Ezarri oinarrizko letra-taina eta ikusi berehala baliokide guztiak.
  • CSS Unitateak Erantzun Duen DiseinarakoBihurtu px, vw, vh eta % artean pantaila-tamaina eta orientazio ezberdinen aurrean behar bezala erantzun duten diseinua sortzeko.
  • Bihurtu Diseinuaren Espezifikazioak CSS UnitateakItzuli Figma edo Sketch pixel-balioak rem/em unitateak CSS inplementazio garbi eta hazgarriarentzat.
  • Tailwind CSS Unitate ErreferentziaUlertu Tailwind CSS tamaina-klaseak pixel eta rem balioetan mapa egiten dituzten inplementazio zehatza.
  • Bihurtu CSS Unitateak Inprimen Estilo-OrrientzatBihurtu px, pt eta rem artean inprimatu media-kontsultetan eta PDF irteera CSS.

Nola Funtzionatzen Du

Bihurketa guztiak erabat zure nabigatzailean funtzionatzen dute kanpo mendekotasunik gabeko eskuz idatzitako aritmetika-motor bat erabiliz. Tresnak zazpi CSS unitateren artean bihurtzen du (px, rem, em, pt, vw, vh, eta %) kalkulu bakoitza pixeletatik oinarri komun gisa bideratuz, zatiketa edo biderketa sinplea aplikatuz zure konfiguratutako erro-letra-tamaina, gurasoaren letra-tamaina, edo ikuspegi-dimentsioen aurka.

  1. 1
    Ezarri zure testuinguru-balioak
    Bihurtu aurretik, CSS unitate erlatiboak esanguratsu egiten dituzten lau zenbakiak konfiguratzen dituzu: erro-letra-tamaina (lehenetsia 16px, nabigatzailearen lehenetsia dena), guraso-elementuaren letra-tamaina (em eta % bihurketetarako), eta ikuspegi-zabalera eta -altuera (vw eta vh-rako). Hauek dira zure nabigatzaileak CSS ebazteko exekuzio-denboran erabiliko lituzkeen balio berberak.
  2. 2
    Pixela tarteko unibertsal gisa
    Bihurgailuak lehenik toPixels() deitzen du zure sarrera pixel-kopuru gordin batera normalizatzeko — adibidez, 1,5rem 1,5 × baseFontPx bihurtzen da, eta 50vw 0,5 × vpWidth bihurtzen da. Gero fromPixels()-ek pixel-kopuru hori helburu-unitatearen faktore egokiaz zatitzen du. Zazpi unitateak aldi berean erakusten dira bihurketa-taulan.
  3. 3
    Hurbileneko Tailwind token-bilaketa
    Bihurtu ondoren, tresnak rem balioa kalkulatzen du eta bi kode gogorreko bilaketa-taula eskaneatzen ditu — Tailwinden hamahiru letra-tamaina token (text-xs etatik text-9xl-raino) eta bere tarte-eskala — distantzia absolutuaren arabera bat-etortze hurbilena aurkituz. = zeinuak balioa token zehatza dela esan nahi du; ≈-k hurbilpen hurbilena dela.
  4. 4
    CSS lote-berridatzea erregex bidez
    Itsatsi-CSS panelak CSS testu gordina onartzen du eta erregex ordezkapen bat aplikatzen du: px→rem moduan px token bakoitza parekatzen du eta zati zenbakizkoa value/baseFontPx + rem-ekin ordezkatzen du; rem→px moduan alderantzizkoa egiten du. Ordezkapen-kopurua erakusten da zenbat balio berridatzi diren egiaztatzeko.

Erlazionatutako tresnak

Maiz egiten diren galderak