Како користити "ЕМС" за промену величина фонтова веб странице (ХТМЛ)

Коришћење Емс-а за промјену величина слова

Када креирате Веб страницу, већина стручњака препоручује вам да величине фонтова (и заправо све) са релативном мером као што су емс, екс, перцентагес или пикелс. То је зато што заиста не знате све различите начине на које неко може да види ваш садржај. Ако користите апсолутну меру (инчи, центиметри, милиметри, тачке или пицке), то може утицати на приказ или читљивост странице на различитим уређајима.

А В3Ц препоручује да користите емс за величине.

Али колико је велики?

Према В3Ц-у ем:

"је једнака израчунатој вредности особине" фонт-сизе "елемента на којем се користи. Изузетак је када се 'ем' појављује у вриједности саме величине фонт-сизе, у ком случају се односи на величину фонта родитељског елемента. "

Другим ријечима, емс немају апсолутну величину. Они узимају своје величине у зависности од тога где се налазе. За већину Веб дизајнера ово значи да су у Веб претраживачу, па је фонт величине 1сам исте величине као и подразумевана величина фонта за тај претраживач.

Али колико је висока основна величина? Не постоји начин да будете 100% сигурни, јер корисници могу да промене своју подразумевану величину фонта у својим прегледачима, али пошто већина људи не може претпоставити да већина прегледача има подразумевану величину слова од 16пк. Дакле већину времена 1ем = 16пк .

Размислите о пикселима, користите Емс за меру

Једном када знате да је подразумевана величина фонта 16пк, онда можете користити емс да бисте дозволили својим клијентима да лако промене величину странице, али размислите у пикселима за величине фонтова.

Реците да имате величину структуру нешто овако:

Можете их дефинирати на тај начин помоћу пиксела за мерење, али онда неко ко користи ИЕ 6 и 7 не би могао промијенити величину странице добро. Зато требате претворити величину у емс и ово је само питање неке математике:

Не заборави наследство!

Али то није све што постоји за емс. Друга ствар коју морате запамтити јесте да они узимају величину родитеља. Дакле, ако имате угнежене елементе са различитим величинама фонтова, можете завршити с фонтом много мањи или већи него што очекујете.

На пример, можда ћете имати овакав стилски стил:

п {фонт-сизе: 0.875ем; }
.фоотноте {фонт-сизе: 0.625ем; }

То би резултирало фонтовима који су 14пк и 10пк за главни текст и фусноте, респективно. Али ако ставите фусноту у параграф, можете завршити са текстом који је 8.75пк, а не 10пк. Пробајте сами, ставите ово горе ЦСС и следећи ХТМЛ у документ:

Овај фонт је висока 14пк или 0.875 емс.
Овај пасус има фусноту у њему.
Иако је ово само параграф фусноте.

Текст фусноте је тешко читати на 10пк, скоро је нечитљив на 8.75пк.

Дакле, када користите емс, морате бити свесни величине родитељских објеката, или ћете завршити са неким стварно чудним величинама на вашој страници.