Ems-г фонтын хэмжээг өөрчлөх
Вэб хуудсыг барьж байх үед ихэнх мэргэжилтнүүд та үсгийн фонтыг (мөн үнэндээ бүх зүйл) санал болгодог бол em, ex, percent, or pixel зэрэг харьцангуй хэмжигдэхүүнийг санал болгож байна. Учир нь та хэн нэгэн таны агуулгыг үзэж болох янз бүрийн аргуудыг үнэхээр мэддэггүй юм. Хэрэв та үнэмлэхүй хэмжээг (инч, см, миллиметр, оноо, эсвэл picas) ашиглавал энэ нь өөр өөр төхөөрөмжүүдийн хуудасны дэлгэц эсвэл уншихад нөлөөлж болох юм.
Мөн W3C нь танд зориулж ems ашиглахыг санал болгож байна.
Гэхдээ Big гэж юу вэ?
W3C-ийн хувьд em:
"элемент нь" үсгийн хэмжээг "өмчийн элементийн тооцоолсон утгатай тэнцүү бөгөөд алдаа нь 'үсгийн хэмжээг' толгой элементийн фонтоор хэмжигдэнэ. "
Өөрөөр хэлбэл, ems нь үнэмлэхүй хэмжээний биш байна. Тэд хаана байгаагаас нь шалтгаалан хэмжлийн хэмжээг нь хэмждэг. Ихэнх Вэб дизайнеруудын хувьд тэд Вэб браузертай байдаг бөгөөд 1em өндөртэй үсгийн фонт нь тухайн вэб хөтөчний анхдагч үсгийн хэмжээтэй ижил хэмжээтэй байдаг.
Гэхдээ анхдагч хэмжээ хэр өндөр вэ? Хэрэглэгчид өөрсдийн үндсэн фонтны хэмжээг өөрийн хөтчүүдэд өөрчилж болох тул 100% тодорхой арга зам байх ёсгүй, гэхдээ ихэнх хүмүүс ихэнх програмууд 16 фантын анхдагч үсгийн хэмжээтэй байдаг гэж үзэх боломжгүй байдаг. Тиймээс ихэнх цаг 1em = 16px .
Pixels-г бодоод үзээрэй
Анхдагч үсгийн хэмжээ 16px гэдгийг та мэдсэний дараа, та өөрийн клиентүүд хуудсыг өөрчлөхөд хялбар болгохын тулд та em-ыг ашиглаж болох боловч фонтын хэмжээгээр пикселүүдийг бодоорой.
Хэмжээний бүтэц танд иймэрхүү байна:
- Текст 1 - 20px
- Текст 2 - 18px
- Текст 3 - 16px
- Үндсэн текст - 14px
- Дэд текст - 12px
- Хөл тэмдэглэл - 10px
Та тэдгээрийг хэмжлийн хувьд пикселээр аргаар тодорхойлж болох боловч IE 6, 7-ийг ашиглаж буй хэн бүхэн таны хуудсыг өөрчлөх боломжтой. Тиймээс та хэмжээсүүдийг ятанд хөрвүүлэх хэрэгтэй бөгөөд энэ нь зөвхөн математикийн асуудал юм:
- Үндсэн 1 - 1.25em (16 x 1.25 = 20)
- Толгой 2 - 1.125em (16 × 1.125 = 18)
- 3 - 1em (1em = 16px)
- Үндсэн текст - 0.875em (16 x 0.875 = 14)
- Дэд текст - 0.75em (16 x 0.75 = 12)
- Хөл тэмдэглэл - 0.625em (16 x 0.625 = 10)
Өв залгамжлалаа бүү мартаарай!
Гэхдээ энэ нь бүхэлдээ ялгарах зүйл биш юм. Таны санаж байх ёстой өөр нэг зүйл гэвэл тэд эцэг эхийнхээ хэмжээнээс хамаардаг. Хэрэв та янз бүрийн фонтоор хийгдсэн элементүүдтэй бол, та үсгийн маягтай бол илүү бага эсвэл илүү их фонтоор төгсөх боломжтой.
Жишээ нь та иймэрхүү загварын хуудастай байж болно:
p {font-size: 0.875em; }
.footnote {font-size: 0.625em; }
Энэ нь үндсэн текст болон заагч тэмдэгтэд зориулсан 14px ба 10px фонтыг үүсгэнэ. Гэхдээ хэрэв та догол мөрөнд бичсэн бол та 10px биш харин 8.75px текстийг бичиж болно. Өөрийгөө туршиж үзээд, дээрх CSS болон дараахь HTML-ийг документэд оруулна уу:
Энэ үсгийн өндөр нь 14px буюу 0.875 Ems юм.
Энэ догол мөрөнд тэмдэглэгээтэй байна.
Энэ бол зүгээр л footnote догол мөр юм.
Footnote текст нь 10px дээр уншихад хэцүү байдаг, энэ нь 8.75px-т бараг гардаггүй.
Тиймээс, та em-ыг ашиглаж байхдаа эцэг эхийнхээ хэмжээнээс маш их мэдлэгтэй байх хэрэгтэй. Эсвэл та өөрийн хуудасны зарим сондгой хэмжээний элементүүдтэй тулгарах болно.