css中em和px的关系和区别

在CSS中，字体大小通常使用px或em单位来指定。它们之间的区别如下：

 p {
    font-size: 14px;
    line-height: 1.5em;
    } 

px是像素单位，它是相对于屏幕分辨率的大小而言的。因此，如果将字体大小设置为14px，则会在屏幕上显示出14个像素。

相比之下，em是相对单位，它是相对于父元素的字体大小来定义的。所以，如果将字体大小设置为1em，那么它将等于父元素字体大小的大小。例如：

 div {
    font-size: 20px;
    }

  p {
    font-size: 1.2em;
    } 

在这个例子中，p元素的字体大小将是父元素字体大小的1.2倍，即24像素。这种相对单位的好处是，它可以根据屏幕或窗口的大小进行缩放，从而使页面更加易读。

注意，em单位也可以用于其他CSS属性，如行高。在上面的例子中，行高设置为1.5em，这意味着每行文本的高度将是当前字体大小的1.5倍。

此外，还有另一种相对单位rem，它是相对于根元素的字体大小进行定义的。因此，如果根元素设置为16像素，1rem就等于16像素。这使得rem在响应式设计中非常有用，因为它可以始终基于根元素字体大小来调整大小，无论屏幕大小如何。

总之，使用哪种字体大小单位取决于您的具体需求。如果要始终使用绝对大小，则使用px单位。如果要相对于父元素进行调整，则使用em单位。如果要相对于根元素进行调整，则使用rem单位。