Выкарыстанне Эмс, каб змяніць памер шрыфта
Калі вы ствараеце вэб-старонку, большасць спецыялістаў рэкамендуюць вам памер шрыфтоў (і на самай справе ўсё) з адноснай мерай, такіх як Ems, EXS, працэнты, або пікселяў. Гэта таму, што вы сапраўды не ведаеце, усе розныя спосабы, што хто-то можа праглядаць кантэнт. А калі вы карыстаецеся абсалютную меру (цалі, сантыметры, міліметры, кропкі, або для піка) гэта можа паўплываць на дысплей або чытальнасць старонкі ў розных прыладах.
І W3C рэкамендуе выкарыстоўваць СЭМ для памераў.
Але як Big гэта Em?
У адпаведнасці з W3C ЕМ:
«Роўна вылічаным значэнні ўласцівасці" памер шрыфта "элемента, на якім яна выкарыстоўваецца. Выключэннем з'яўляецца, калі" іх "адбываецца ў значэнні ўласцівасці" памер шрыфта "сам, у гэтым выпадку яно адносіцца да памеру шрыфта бацькоўскага элемента «.
Іншымі словамі, Эмс не мае абсалютнага памеру. Яны прымаюць на іх значэння памеру на аснове таго, дзе яны знаходзяцца. Для большасці вэб - дызайнераў , гэта азначае , што яны знаходзяцца ў вэб - браўзэры, таму шрыфт , які 1em высокі сапраўды такі ж памер , як памер шрыфта па змаўчанні для гэтага браўзэра.
Але наколькі высокім гэта памер па змаўчанні? Там няма ніякага спосабу, каб быць 100% упэўненыя, што кліенты могуць змяніць іх памер шрыфта па змаўчанні ў браўзэрах, але так як большасць людзей, вы не можаце выказаць здагадку, што большасць браўзэраў маюць памер шрыфта па змаўчанні ў 16px. Таму большая частка часу 1em = 16px.
Думайце ў пікселях, Выкарыстоўваць Эмс Меру
Пасля таго, як вы ведаеце, што памер шрыфта па змаўчанні 16px, вы можаце выкарыстоўваць Эмс, каб дазволіць сваім кліентам змяніць памер старонкі лёгка, але думаюць, што ў пікселях для вашых памераў шрыфта.
Скажам, у вас ёсць структура праклейвання нешта накшталт гэтага:
- Загаловак 1 - 20px
- Загаловак 2 - 18px
- Загаловак 3 - 16px
- Асноўны тэкст - 14px
- Sub тэкст - 12px
- Зноскі - 10px
Вы можаце вызначыць іх такім чынам, выкарыстоўваючы пікселі для вымярэння, але потым нехта з дапамогай IE 6 і 7 не будзе мець магчымасць змяніць памер старонкі добра. Такім чынам, вы павінны пераўтварыць памеры ў Эмс, і гэта толькі пытанне нейкі матэматыкі:
- Загаловак 1 - 1.25em (16 х 1,25 = 20)
- Загаловак 2 - 1.125em (16 × 1,125 = 18)
- Загаловак 3 - 1em (1em = 16px)
- Асноўны тэкст - 0.875em (16 х 0,875 = 14)
- Суб тэкст - 0.75em (16 х 0,75 = 12)
- Зноскі - 0.625em (16 х 0,625 = 10)
Не забудзьцеся Успадкоўванне!
Але гэта яшчэ не ўсё, што ёсць у Эмс. Іншая рэч, якую вы павінны памятаць пра тое, што яны бяруць на памер аднаго з бацькоў. Так што калі ў вас ёсць укладзеныя элементы з рознымі памерамі шрыфта, вы маглі б у канчатковым выніку з хрысцільняй значна меншым ці большым, чым вы чакаеце.
Напрыклад, вы можаце мець табліцу стыляў, як гэта:
р {памер шрыфта: 0.875em; }
.footnote {памер шрыфта: 0.625em; }
Гэта прывядзе да шрыфтоў, якія 14px і 10px для асноўнага тэксту і зносак адпаведна. Але калі паставіць зноску ў абзац, вы маглі б у канчатковым выніку з тэкстам, які 8.75px, а не 10px. Паспрабуйце самі, паставіць гэта вышэйзгаданы CSS і наступны HTML у дакумент:
Гэты шрыфт 14px або 0,875 Эмс у вышыню.
Гэты пункт мае зноску ў ім.
Хоць гэта толькі зноска пункт.
Тэкст зноскі цяжка чытаць у 10px, гэта амаль неразборлівыя ў 8.75px.
Такім чынам, калі вы выкарыстоўваеце СЭМ, вы павінны быць добра дасведчаныя аб памерах бацькоўскіх аб'ектаў, ці вы ў канчатковым выніку з некаторымі сапраўды няцотнымі памерамі элементаў на вашай старонцы.