使用“em”调整字体大小仍然相关？ [英] Is sizing fonts using "em" still relevant?

问题描述

在调整字体大小时使用 em 的用户会知道，在处理嵌套元素时，它们可能会令人头痛，并且必须使用 px - >

考虑到这些（公认的较小的）问题，并给出了主要浏览器在本地处理诸如页面缩放/缩放之类的辅助功能问题时最近的进展是，是否使用em em来缩小仍然被认为有价值的字体？ *

*旧版浏览器（IE6）支持排除。

解决方案

不要为屏幕样式表以绝对长度单位指定font-size。它们在不同平台上呈现不一致，并且无法由用户代理（例如浏览器）调整大小。

如果您将使用此方法，则无需计算

您可以将主体的字体大小设置为62.5％（即默认值16px的62.5％），等于10px或0.625EM。现在您可以使用易于记住的转换在EM中设置字体大小，将px除以10.

  * 12px = 1.2EMs 
 * 13px = 1.3EMs 
 * 16px = 1.6EMs 
 * 8px = 0.8EMs 
 * etc ... 
  

这使得一切超级容易记住，消除了对转换表的需要。当然，如果你不是在你的CSS中使用EM，那么你仍然需要使用嵌套元素的转换表，这是一个完全独立的问题。

但是76％的效果要好得多，您可以使用它来计算）。

SO上几乎类似或相关的问题

href =http://stackoverflow.com/questions/293247/is-there-really-any-point-to-using-relative-font-sizing-in-css>真的有任何意义使用相对字体大小在CSS中？

为什么要用em而不是px？

CSS中的字体大小 - ％或em？

CSS字体大小：相对值与绝对值。哪个使用？

EM问题

在CSS中使用relative而不是固定大小

有用的在线工具px to em

http： //pxtoem.com/

http： //riddle.pl/emcalc/

http：//convert-to.com/pixels-px-to-em-conversion.html

将整个网站从px转换为em（此工具仍在开发中）

http://converter.elementagency.com/

EM Calculator AIR应用程式（可在所有装置上使用）

http://jameswhittaker.com/journal/em-based-layouts-vertical-rhythm-calculator/

http://jameswhittaker.com/projects/apps/em-calculator-air-application/

Windows应用程式

http://www.thebrightlines.com/2009/11/16/pixem-pixel-to-em -converter /

http://www.storkas.com/Projects.aspx(go 底部）

CSS的Pixels to Ems转换表

http：/ /jontangerine.com/silo/css/pixels-to-ems/

http://reeddesign.co.uk/test/points-pixels.html

emchart

http： //aloestudios.com/tools/emchart/

http://aloestudios.com/code/emchart/

有关此问题的更多文章 p>

http://www.d.umn.edu/itss/support/Training/Online/webdesign/type.html

Those of you who use em when sizing fonts will know that they can be a headache when dealing with nested elements, and having to make the px -> em calculations (to ensure your design interpretation is correct @ 100%) consumes extra time.

With these (admittedly minor) issues in mind, and given the recent progress the major browsers have made towards natively dealing with accessibility issues such as page scaling / zooming, is using em to size fonts still considered worthwhile? *

*legacy browser (IE6) support excluded.

解决方案

Do not specify the font-size in absolute length units for screen stylesheets. They render inconsistently across platforms and can't be resized by the User Agent (e.g browser). Keep the usage of such units for styling on media with fixed and known physical properties (e.g print)

If you will use this method, no need to calculate

You can set the font-size of the body to 62.5%(that is 62.5% of the default of 16px), which equates to 10px, or 0.625EMs. Now you can set your font-size in EMs with an easy to remember conversion, divide the px by 10.

* 12px = 1.2EMs
* 13px = 1.3EMs
* 16px = 1.6EMs
* 8px = 0.8EMs
* etc…

This makes everything SUPER easy to remember and eliminates the need for conversion tables. Of course, you will still need to use a conversion table for nested elements when using EMs, if you are not being specific in your CSS, which is a whole separate issue.

But 76% is much better and you can use this to calculate http://pxtoem.com/

Yes it's still relevant:

IE6 is still widely used and is unable to resize the fonts defined in px. => Usability issues. That alone is a no-no.

and

IE 7 and 8 don't resize text sized with pixels either, actually. They do have page zoom, but some people prefer to incease text size only.

Here's a summary of what's good and bad about font sizing in general.

I personally like ems. Others, like Chris Coyier over at CSS-Tricks.com likes pixels. (Chris has an excellent article on the different font units).

It really comes down to personal preference.

Almost similar or related questions on SO

Should we still use em and % for defining the font-size of the website elements?

Is there really any point to using relative font sizing in CSS?

Why em instead of px?

Font size in CSS - % or em?

CSS font size: relative vs. absolute values. Which to use?

Problem with EM

Using relative instead of fixed size in CSS

Helpful online tool for px to em

http://pxtoem.com/

http://riddle.pl/emcalc/

http://convert-to.com/pixels-px-to-em-conversion.html

Convert entire site from px to em (This tool is still in development)

http://converter.elementagency.com/

EM Calculator AIR application (will work on all os)

http://jameswhittaker.com/journal/em-based-layouts-vertical-rhythm-calculator/

http://jameswhittaker.com/projects/apps/em-calculator-air-application/

Windows apps

http://www.thebrightlines.com/2009/11/16/pixem-pixel-to-em-converter/

http://www.storkas.com/Projects.aspx(go at bottom)

Pixels to Ems Conversion Table for CSS

http://jontangerine.com/silo/css/pixels-to-ems/

http://reeddesign.co.uk/test/points-pixels.html

emchart

http://aloestudios.com/tools/emchart/

http://aloestudios.com/code/emchart/

Some more articles on this issue

http://www.d.umn.edu/itss/support/Training/Online/webdesign/type.html

这篇关于使用“em”调整字体大小仍然相关？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！