美文网首页
CSS样式表中单位em的来历

CSS样式表中单位em的来历

作者: 零下一度__ | 来源:发表于2017-05-11 20:29 被阅读0次

            在构建css样式表的时候常用的单位有px,em,rem,在实际应用中已经很少使用px,“px是绝对单位,em则是相对单位。在响应式和移动端设计的大前提下,使用em能够更方便快捷的一次性调整web文档及其HTML元素的字体大小、宽度、边距、边框等一系列属性,一般来说使用em作为单位比px更灵活”(参考 CSS中的em单位)。

            此处暂不分析em的使用,我在学习的过程喜欢弄明白这些词语简写的来源,这样我才能记得住,百度搜索的结果净是些重复内容的垃圾和停留在皮毛层面的知识碎片。在一篇文章中找到点线索

    Use ems to make scalable style sheets

    The foremost tool for writing scalable style sheets is the "em" unit, and it therefore goes on top of the list of guidelines that we will compile throughout this chapter:use ems to make scalable style sheets.Named after the letter "M", the em unit has a long-standing tradition in typography where it has been used to measure horizontal widths. For example, the long dash often found in American texts (--) is known as "em-dash" since it historically has had the same width as the letter "M". Its narrower cousin (-), often found in European texts is similarly referred to as "en-dash".

    The meaning of "em" has changed over the years. Not all fonts have the letter "M" in them (for example Chinese), but all fonts have a height. The term has therefore come to mean the height of the font - not the width of the letter "M".

    In CSS, the em unit is a general unit for measuring lenghts, for example page margins and padding around elements. You can use it both horizontally and vertically, and this shocks traditional typographers who always have used em exclusively for horizontal measurements. By extending the em unit to also work vertically, it has become a very powerful unit - so powerful that you seldom have to use other length units.

    另一处说明

    The name em was originally a reference to the width of the capital in the typeface and size being used, which was often the same as the point size.     

            在印刷行业em是一个使用很久的单位,最早因字母“M”而得名,用来表示字符宽度,后来表示字高度,再后来经过使用扩展,它被用来表示css样式表中字符的相对大小。

            说句题外话,在英文书写规范中,em dash (—) 和en dash (–) 以及 hyphen (-)是不同的标点符号,有不同的用处,英文写作中要注意(可参考)。

    相关文章

      网友评论

          本文标题:CSS样式表中单位em的来历

          本文链接:https://www.haomeiwen.com/subject/zyhatxtx.html