Përdorimi i Ems për të ndryshuar madhësinë e shkronjave
Kur po ndërton një faqe Web, shumica e profesionistëve rekomandojnë që fontet e madhësisë (dhe në të vërtetë, gjithçka) të matni me një masë relative si ems, exs, përqindje ose piksele. Kjo është për shkak se ju vërtet nuk i dini të gjitha mënyrat e ndryshme që dikush mund të shikojë përmbajtjen tuaj. Dhe nëse përdorni një masë absolute (inç, centimetra, milimetra, pika ose picas), kjo mund të ndikojë në ekranin ose lexueshmërinë e faqes në pajisje të ndryshme.
Dhe W3C rekomandon që të përdorni EMS për madhësi.
Por sa i madh është një em?
Sipas W3C an em:
"është e barabartë me vlerën e llogaritur të pronës 'font-size' të elementit në të cilin përdoret. Përjashtim është kur 'em' ndodh në vlerën e vetë 'font-size', në të cilin rast i referohet në madhësinë e shkronjave të elementit mëmë. "
Me fjalë të tjera, ems nuk kanë një madhësi absolute. Ata marrin vlerat e tyre të përmasave në bazë të vendit ku ndodhen. Për shumicën e Web designers , kjo do të thotë se ata janë në një shfletues Web, kështu që një font që është 1em i gjatë është saktësisht me madhësinë e njëjtë si madhësia e parazgjedhur e shkrimit për atë shfletues.
Por sa i gjatë është madhësia e paracaktuar? Nuk ka asnjë mënyrë për të qenë 100% i sigurt, pasi konsumatorët mund të ndryshojnë madhësinë e tyre të paracaktuar të shkrimit në shfletuesit e tyre, por pasi që shumica e njerëzve nuk mund të supozojnë se shumica e shfletuesve kanë një madhësi të parazgjedhur prej 16px. Pra, shumica e kohës 1em = 16px .
Mendoni në Pixel, Përdor Ems për Masën
Sapo të dini se madhësia e parazgjedhur e shkronjave është 16px, atëherë mund të përdorni ems për të lejuar klientët tuaj që ta ridimensionojnë faqen lehtë, por mendojnë në piksele për madhësitë e shkronjave.
Thuaj që keni një strukturë të përmasave si kjo:
- Titulli 1 - 20px
- Titulli 2 - 18px
- Titulli 3 - 16px
- Teksti kryesor - 14px
- Nën tekst - 12px
- Fletnotat - 10px
Ju mund t'i definoni ato në atë mënyrë duke përdorur piksele për matjen, por pastaj secili që përdor IE 6 dhe 7 nuk do të jetë në gjendje ta ndryshojë faqen tuaj mirë. Kështu që ju duhet të konvertojë madhësive të ems dhe kjo është vetëm një çështje e disa matematikë:
- Titulli 1 - 1.25em (16 x 1.25 = 20)
- Titulli 2 - 1.125em (16 × 1.125 = 18)
- Titulli 3 - 1em (1em = 16px)
- Teksti kryesor - 0.875em (16 x 0.875 = 14)
- Nën tekst - 0.75em (16 x 0.75 = 12)
- Shënime në fund - 0.625em (16 x 0.625 = 10)
Mos harro trashëgiminë!
Por kjo nuk është e gjitha që nuk ka EMS. Gjëja tjetër që duhet të mbani mend është se ata marrin përmasën e prindit. Pra, nëse keni elementë të mbivendosur me madhësi të ndryshme të shkronjave, mund të përfundoni me një font shumë më të vogël ose më të madh se sa prisni.
Për shembull, mund të keni një fletë stili si kjo:
p {font-size: 0.875em; }
.footnote {font-size: 0.625em; }
Kjo do të rezultojë në fonts që janë 14px dhe 10px për tekstin kryesor dhe shënimet përkatëse. Por në qoftë se vendosni një shënim brenda një paragrafi, mund të përfundoni me tekst që është 8.75px dhe jo 10px. Provoni vetë, vendosni këtë CSS më sipër dhe HTML në vijim në një dokument:
Ky font është 14px ose 0.875 ems në lartësi.
Ky paragraf ka një shënim në të.
Ndërsa kjo është vetëm një paragraf fusnotë.
Teksti i fusnotës është i vështirë për tu lexuar në 10px, është gati i palexueshëm në 8.75px.
Pra, kur jeni duke përdorur ems, ju duhet të jeni shumë të vetëdijshëm për madhësitë e objekteve mëmë, ose do të përfundoni me disa elementë me të vërtetë të çuditshëm në faqen tuaj.