CSS字体大小:相对于绝对值.哪个用？

我将字体大小保留为用户选择的默认值,然后使用相对大小调整:

body {
    font-size: 100%;
}

p {
    font-size: 1em;
}

h1 {
    font-size: 1.8em;
}

此方法尊重用户在浏览器中选择的字体大小,通常设置为16px.

1> bobince..：

---

哪个用？

都.相对于主体文本,用户将不得不阅读很多(因此他们希望能够舒适地阅读它); 对于必须调整大小以匹配页面上以像素为单位的其他元素(例如图像)的文本的绝对值.

对于亲戚,'%'和'em'同样好.

对于绝对,请始终使用'px'.永远不要使用'pt'进行屏幕使用,它只适用于打印样式表.遗憾的是'pt'被认为是字体处理的默认单位,因为在网络上它是最糟糕的选择.

(ETA:请注意,自从这个答案以来,CSS3 重新定义了'物理单位',因此px并且pt总是成比例的.所以除非你关注非常古老的浏览器,否则这个问题不再重要.)

有些人不喜欢相对字体大小的"复合"效果.实际上,诀窍是使用尽可能少的字体大小更改,以避免太多嵌套.它应该是可以通过使用字体大小关键字"小" /"中" /"XX-大" /等,但不幸的是这种方式,你得到不配合行为的相对到user's首选尺寸行为没有太多的粒度,甚至今天仍然存在浏览器如何处理它们之间的差异.

---

'%'和'em'不一样好.当用户更改基本字体大小时,它们会以不同方式缩放.我建议将基本字体大小设置为"小"并在此之后使用百分比.http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/

2> Philip Morto..：

---

我将字体大小保留为用户选择的默认值,然后使用相对大小调整:

body {
    font-size: 100%;
}

p {
    font-size: 1em;
}

h1 {
    font-size: 1.8em;
}

此方法尊重用户在浏览器中选择的字体大小,通常设置为16px.

3> nickf..：

---

我个人设置了一个绝对的字体大小body,从那里设置一切相对于那个.例如:

body {
    font-size: 10px;    /* or pt if you want */
}
h1 {
    font-size: 200%;
}

试着避免组合复合相对大小:

body {
    font-size: 10px;
}
p {
    font-size: 80%; /* 8px, right? */
}
div {
    font-size: 150%;
}
/* what size is a "div > p" ? */

现在所有的现代浏览器都有全页面缩放,这意味着即使调整字体大小也是可以的.

此方法的好处是,您可以通过更改一个定义轻松调整所有文本的大小.

缺点是,如果要更改默认字体大小,而不是标题(例如),则需要更改许多声明.

4> Alex..：

---

List Apart 对字体大小在各种浏览器中的工作方式做了大量的介绍.事实证明它比你期望的更复杂,就像CSS中的其他一切一样.共识似乎倾向于使用ems,因为这使用户可以更好地控制在浏览器中调整字体大小.