| Autor | Zpráva | ||
|---|---|---|---|
| Chamurappi Profil |
#1 · Zasláno: 30. 4. 2012, 15:10:59
Na JPW se píše, že jednotka
em odpovídá šířce velkého písmena M. Též jsem si to dlouho myslel (nevím, zda jsem se to naučil z JPW nebo odjinud), teprve před měsícem jsem prozřel (díky odkazu od Dana99). Prapůvodní plán byl, že jednotka opravdu bude odvozena od M, ale nakonec W3C zadefinovalo a prohlížeče implementovaly, že 1em odpovídá přesně velikosti font-size. Nezáleží vůbec na proporcích písma — je jedno, jestli se používá obrovská Verdana, nebo mrňavé Calibri. Pokud je třeba font-size: 16px, platí vždy 1em = 16px.
Naproti tomu jednotka ex je opravdu oficiálně výškou písmena x, u té je vysvětlení správně. Na JPW zmiňovaný přepočet 1em = 2ex je také povolený, pokud je prohlížeč líný přeměřovat písmo. Explorer přestal být líný ve verzi 8, Opera ve verzi 11.60.
Proužky v příkladech se nyní nikde nezobrazují podobně široké (za běžného stavu). Proužek s em by musel mít šířku 12em, aby při výchozí velikosti písma odpovídal 192px. Proužek s ex je trochu složitější, ten by měl mít při výchozím písmu Times New Roman šířku cca 26.85ex, aby byl podobně široký jako 12em (v líných prohlížečích by stačilo 24ex).
Proužky by měly vypadat nějak takto:
width: 192px
width: 12em
width: 26.85ex
width: 5.08cm
width: 50.8mm
width: 2in
width: 144pt
width: 12pc
A pro méně podporované jednotky:
width: 19.2rem
width: 24ch
(Zde na diskusi má kořenový element font-size: x-small, proto 1rem při výchozí velikosti písma v prohlížeči bude odpovídat nejspíš 10px.)
|
||
| _es Profil |
Chamurappi:
„Proužky v příkladech se nyní nikde nezobrazují podobně široké (za běžného stavu)“ chybička - CSS vlastnost Filter Okrem toho stačí mať v systéme nastavené iné rozlíšenie ako 96 dpi a rozutekajú sa aj ďalšie prúžky. „W3C zadefinovalo a prohlížeče implementovaly, že 1em odpovídá přesně velikosti font-size.“ Alebo, inak formulované, 1em = 100%.
|
||
|
Časová prodleva: 12 měsíců
|
|||
| melo Profil * |
#3 · Zasláno: 12. 4. 2013, 08:59:06
No jo... Ale co se s tím dá dělat?
|
||
| Chamurappi Profil |
#4 · Zasláno: 12. 4. 2013, 13:30:42
Reaguji na mela:
S čím přesně? Tady jsem nepopisoval problém, jen nepřesnost formulace. |
||
| melo Profil * |
#5 · Zasláno: 13. 4. 2013, 12:35:38
S tím, že se ty proužky nezobrazují stejně široké, jak píše _es.
|
||
| margin Profil * |
#6 · Zasláno: 13. 4. 2013, 13:07:17
Není to chyba, je to vlastnost. Pokud chceš dělat stejně široké proužky, tak se k tomu em nehodí.
|
||
| melo Profil * |
#7 · Zasláno: 13. 4. 2013, 13:24:03
Jaj, omlouvám se. Nějak jsem ten poslední odstaveček prvního příspěvku při prvním přečtení nepobral. Sice přečel, ale moc nevnímal obsah, neboť jsem si zřejmě myslel, že je ten příklad už opravený a přesto se zobrazuje špatně. Moje chyba.
|
||
|
Časová prodleva: 9 měsíců
|
|||
| aleskva Profil * |
Uvažujme, že výchozí nastavení prohlížeče je, že 1rem = 100% = 16px; Je-li na proužky nastavena základní velikost tak, aby měly tuto výchozí hodnotu, tak stačí nastavit opravdu 12em na proužek, přesně, jak píše Chamurappi. A ano, s ex je to trochu složitější. Každopádně drobná úprava ve smyslu 26.85ex by měl pro názornost stačit s tím, že bych pod proužky dopsal něco vy smyslu:
* Jednotka em je relativní vzhledem k základní velikosti písma nastavené v prohlížeči a k uživatelským kaskádovým stylům (viz definice výše). ** Jednotka ex je pouze přibližná a může se, narozdíl od ostatních jednotek mírně lišit (viz definice výše). A popis u em bych trochu poupravil, přesně, jak píše Chamurapi. P.S.: Yuhů by měl dodělat i proužek pro Rem 2. P.S.: Neuvažuješ Yuhů o GitHubu? Moderátor Petr ZZZ: Plné znění tohoto P.S. a reakce na něj byly vyčleněny do samostatného vlákna: Jak trvalý by měl být obsah internetové stránky?
|
||
| _es Profil |
#9 · Zasláno: 5. 1. 2014, 15:13:44
Na stránke je:
„Doporučení: vyberte si jednu "oblíbenou" jednotku a všechno uvádějte v ní. Časem se velmi dobře naučíte, jak je velká a co v ní máte jak zadat. Doporučuji samozřejmě pixel a jako pomocnou relativní jednotku em.“ Nejaký dôvod doporučenia pixelu? Mne sa skôr zdá, je v tunajšej diskusii to nie je až tak doporučovaná jednotka. |
||
| Chamurappi Profil |
#10 · Zasláno: 5. 1. 2014, 17:53:48
Doplnil jsem do úvodního příspěvku vylepšenou ukázku proužků, včetně
rem a ch (což je šířka nuly).
Reaguji na _es: „Mne sa skôr zdá, je v tunajšej diskusii to nie je až tak doporučovaná jednotka.“ Doporučil bych: • na velikost písma procenta a klíčová slova ( small, medium apod.),
• na šířky pixely, procenta nebo em,
• na výšky řádků a jednoslovných bloků em, ostatním textovým blokům výšku vůbec nenastavovat,
• na paddingy a marginy upřednostnit em,
• na přesné formátování v tiskovém stylu používat cm nebo mm,
• na jednotky ex, in, pt, pc, rem a ch pozapomenout (nepoužívat, ale vědět, že existují).
V budoucnu bude možná zajímavá jednotka vw (setina šířky prohlížeče), tu bych možná užíval na šířky. Na vh (setina výšky prohlížeče) se také může pozapomenout. Jednotka vmin (menší z vw a vh) se možná bude hodit k určení rozměrů obrázku na mobilech, kde se zatím uplatňuje trik s paddingem.
|
||
| weroro Profil |
#11 · Zasláno: 5. 1. 2014, 18:01:41
Chamurappi:
„Doplnil jsem do úvodního příspěvku vylepšenou ukázku proužků, včetně rem a ch (což je šířka nuly).“ Nie som si istý, či som správne pochopil chovanie prúžku s nastavenou šírkou 12ch. Zobrazuje sa mi totiž na celú šírku rodičovského elementu (ako keby mal nastavený 100%) Používam Operu 12.16 |
||
| Chamurappi Profil |
Reaguji na werora:
Takto se projevuje nepodpora jednotky ch. Přemýšlel jsem, jaký tam dát fallback, ale nic rozumného mě nenapadlo, takže se <div> roztáhne, jako by měl width: auto.
„nastavenou šírkou 12ch“ On má 24ch, v textu uvnitř proužku jsem zapomněl přepsat číslo (opraveno). Znak nuly u Times New Roman může mít šířku třeba 0.5em, tj. při výchozí velikosti písma 8px, což je 1/24 ze 192px.
Edit: Teď koukám na telefonu, že je v Exploreru 9 ch užší, cca 0.44em, ale ukázku nahoře už se mi měnit nechce.
|
||
| aleskva Profil * |
#13 · Zasláno: 5. 1. 2014, 19:03:23 · Upravil/a: Moderátor (editace znemožněna) 5. 1. 2014, 21:47:56
Ex jednotky a Ch jednotky se u různých prohlížečů liší. Porovnal jsem jich několik a souhlasím, že zlatý střed, který podporuje většina je tady na DJPW 24ch a 26,9ex. Jakže jste přišli na to číslo 26,85ex (řečnická otázka, já to tady někde najdu)?
...aha, JPW jede na Times New Roman, zkusím to ještě otestovat přímo tam... Ano, u většiny prohlížečů souhlasí všechny jednotky i jejich délky až na rem, která by měla být stejná jako em, jelikož na JPW žádná základní velikost písma nastavena není. Tak ještě tu upravit a ať to tam Yuhů nahraje ;-) Moderátor Petr ZZZ: Část tohoto příspěvku přesunuta do zmíněného samostatného vlákna.
|
||
|
Časová prodleva: 10 let
|
|||
0