我应该使用像素，em还是不使用像素？

Question

我正在尝试用css中的某些东西得到明确的答案。我想弄清楚我是否应该使用

line-height: 1.5;

或

line-height: 1.5em;

或

line-height: 15px;

有些网站说不要指定em或px。所以在那个说明中，我应该说：

margin: 10px;

或

margin: 10em;

你有什么看法？

Answer 1

无单位数字特别适用于line-height，因为其他单位可能存在继承问题，如MDN line-height docs中所述。

对于其他属性，它将完全取决于您想要的内容，以及您是希望事物的大小是固定的，还是相对于文本的大小。

Answer 2

Em允许你的网站是elasatic所以iit根据屏幕大小调整大小，但是，如果你真的希望它能很好地工作，那么你可以在页面上使用EM进行所有测量。我发现在大多数布局中都使用EM。

Answer 3

显然这取决于很多事情。

作为一般规则，将em用于与文本相关的任何内容，并将px用于与装饰相关的任何内容。所以填充和边框应该是px，文本大小，宽度，高度等应该是em或％（或更好，流畅的布局）。

想象一下你正在使用大文字显示; 你想要变大的元素是什么？使边界更大可能会留下更少的文本空间，所以这将是一件消极的事情。

对于行高，你应该不使用单位（或者em，但是浪费2个字符）;它是字体大小的一部分。如果您使用了px，则最终可能会出现一个小于文本的行高，即 bad 。

这个网站提出了一个关于无单元与em的有趣观点：http://meyerweb.com/eric/thoughts/2006/02/08/unitless-line-heights/。这个想法是使用em将为所有孩子设置固定的行高，即使字体大小不同，而使用no unit将使用始终相对于字体大小的行高。在大多数情况下，后者会更好，但我可以想到你也想要前者的情况。

Answer 4

尽可能不要在定义边距时使用 px 。使用 em 或％等相对单位，因为它是可重排的布局。我们必须始终想象并考虑小型设备上的布局和调整大小的文本。

• 对于垂直文本边距（margin-top或margin-bottom），使用ems as 这取决于font-size

• 对于水平宽度，请使用％

• 对于左边界附近的边距，我们可以使用px，如果它小于 50像素。

• 确保所有图像都包含在div / figure元素中 img设置为100％，height设置为auto

• 建议将横向尺寸的图像设置为50％ 宽度并浮动到左侧或右侧

• 建议将纵向尺寸的图像设置为33％ 宽度并浮动到左侧或右侧