Rob*_*Cox 15 html css fonts margin padding
似乎所有字体都有某种嵌入式填充或边距.通过设置:
margin: 0px;
padding: 0px;
你永远不会得到你想要的.有谁知道这是为什么？
Mat*_* R. 23
听起来你遇到的问题不是CSS而是字体本身.大多数字体定义了基线,x高度和开箱即用的行高.您的具体问题可能是字体的前导,即行之间的空格.有时这些值可能会非常不一致.如果你真的想让一个特定的字体正确排列,我建议看一下FontLab并编辑你正在使用的特定字体的字形/基线/行高.
您还可以查看该字体的Web安全版本.这些类型的字体通常具有特定的间距,以便在网络上呈现最佳效果.情况并非总是如此,但它可能会为您提供所需的结果.在这里查看Google的网络字体库.
更新
这个答案得到了足够的重视,我决定将下面的第一条评论添加到答案中并对其进行阐述.
浏览器重置:每个浏览器都会为许多保留的HTML标签设置默认状态,如a和strong.默认情况下还定义了其他内容,包括字体,线高,重量和大小.这可能会影响字体的渲染.通常,这是针对特定浏览器的.因此,通过使用CSS重置,您可以消除浏览器中的默认呈现问题.Eric Meyers Reset是一个很好的重置,但肯定有其他人.尝试使用不同的方法来查看最适合您的方法.
但是,CSS会通过定位所有浏览器并将它们设置为相同来重置工作.有些人更喜欢使用某些东西,而只是针对每个浏览器的问题.那就是Normalize会更好.
还存在CSS重置无法修复的问题.比如字体别名(使字体显得平滑而不是锯齿状).由于某些浏览器和操作系统不会为字体添加抗锯齿,因此您还会看到字形宽度差异.不幸的是,这在大多数情况下是不可避免的.有些人选择使用像Cufon或Sifr这样的flash字体替换工具.这也有它自己的问题清单(例如FOUC).
另一个更新
另外一个问题仍然存在于字距调整或字形之间的空间问题.有一个CSS属性letter-spacing可以让你在一个文本块上做一个全局kern,但是它缺乏定位像Photoshop或InDesign这样的单个字形的能力.字距调整也基于全像素,因此您受限于您可以实现的目标.它也有IE的问题,并不像人们希望的那样可靠.有一个名为kerningjs的javascript 非常不错,但它也是基于全像素的,因此不如光栅化文本准确.
总体而言,过去几年网络上的字体变得更好.可悲的是,我们仍在处理过去的问题,因为字体只是打印或光栅化.不过,对于我们的字体爱好者来说,还有希望.正如@allcaps所说,线盒的CSS3规范就在那里,所以它被广泛接受只是时间问题!
The reasons of this pecularity of the computer fonts are mostly historical. In the past, fonts were the sets of small metal blocks with one character on each, and the height of these blocks had to be enough to contain all the elements of any character, including descendants, ascendants and diacritical marks. The typographic tradition has defined the font size as the height of such metal blocks. That's why almost all actual characters are usually much smaller visually than the font size set for the text and there is some white space above and below them.
这是一篇很好的文章,解释了主要排版测量的历史根源:http://www.dev-archive.net/articles/typograph1-en.html#Ch22
如果您想在段落中使用行间距，可以使用：
line-height: 3px; /*3px is an example*/
或者，如果您在字母之间使用空格，则可以使用：
letter-spacing: -2px;