Web设计中的垂直节奏/基线网格
Answers:
网页设计中的基线网格是一个学术难题，但从硬编码的数学角度来看，这几乎是不切实际的。由于CSS没有类型基线的概念，因此从技术上讲不可能获得匹配的基线。
您可以接近间隔事物，但最终会得到一些在看数字时可能有意义的事物，但可能在视觉上偏离了事物，最终您偏离了公式以确保事物看起来正确。
因此，总而言之，视觉节奏很重要，但要根据自己的直觉来构建视觉节奏，而不是一些方程式会直接影响您在网络上正确实施。
顺便说一句，请注意基线网格的概念来自印刷设计领域……尤其是多列布局，例如在报纸中，您希望该类型优先排列在列之间。为了便于排版这种出版物，基线网格很有意义，并且在DTP应用程序领域相对容易实现。
垂直节奏并不难实现，尤其是从CSS reset开始的时候。不久前，我偶然发现了该链接http://24ways.org/2006/compose-to-a-vertical-rhythm，此后在我的所有设计中一直使用该技术。
我发现，在CSS文件中使用一组“罐头”类型声明（h1-h6，p等-具体来说，大小，行高，下边距）后，部署起来非常容易。
这是一张背景图片，可以帮助我更清楚地了解事物……尤其是当我第一次使用垂直节奏时。
可能很难看到它，但是当重复作为背景图像时：您将看到20x20的网格。
高温超导
注意：与那些没有使用过该技术的网站相比，我更喜欢使用该字体的网站。但是，在这两种情况下，似乎总是有一个或两个元素必须“欺骗系统”才能看起来“正确”。我还发现，注意整体的行高（例如12px字体的字体为18px）会使图像，图形标题等的边距和填充变得非常简单（18px）。另外...计算所有内容的欲望消失了...您将开始注意到布局的“垂直节奏”，并能够从非常短的值列表中提取正确的填充/边距/行高在你的头上。
在Smashing Magazine上有关基线和垂直节奏的这篇非常不错的文章使您对基线在Web设计中的重要性以及如何在CSS中实现基线有一定的了解。它在默认html元素上使用字体大小，行高，填充和边距，以使排列与基线网格对齐。
为了使所有内容与网格匹配，如Dawson所建议的，背景图像非常有用。
我在最新的几项设计中一直沿用这种技术，并且我认为它确实很有价值。