文章目录
- 【他山之石】Leading-Trim: The Future of Digital Typesetting：数字排版的未来 —— Leading-Trim
- How an emerging CSS standard can fix old problems and raise the bar for web apps
- 1. The problem with text boxes today
- 2. How we got here: a history lesson
- 3. Workarounds are just workarounds
- 4. Introducing leading-trim
- 5. Leading-trim fixes alignment issues
- 6. Other immediate impacts: consistency and workflow improvements
- 7. Small change, big implications
- 8. Microsoft’s role in this effort
写在前面
本文是《CSS in Depth》全新第2版12.1节内容中提供的延伸阅读材料（详见我的 CSS 同名翻译专栏 【CSS in Depth 2 精译_073】）。由于没找到完整转载，特此整理，择日再翻译成中文，敬请关注！
【他山之石】Leading-Trim: The Future of Digital Typesetting：数字排版的未来 —— Leading-Trim
How an emerging CSS standard can fix old problems and raise the bar for web apps
by Ethan Wang, Aug 18, 2020 (9 min read)
1. The problem with text boxes today
In a standard text box, there’s almost always extra space above and below the actual text. Because of this, when you use a text box to measure and implement spacing, it ends up larger than you intended. The bigger the line height, the bigger the problem. The example below shows distances between text boxes set to 32px. As you can see, all the vertical spacing is visually much bigger than 32px, even though you set them all to the same value.
This is a common problem that spans tools and platforms. In my last Medium article, I talked about how I use the 4px baseline grid to measure spacing around text and achieve better visual accuracy. Knowing the imperfections of this approach, I kept searching for a better solution. Last June, I came across an emerging CSS feature spec called leading-trim. I’ve been working with the author of the spec, an expert from the W3C CSS Working Group, fantasai, to make sure Microsoft Design can be a part of this transformative work.
Today, we’re excited to announce that Microsoft Design is sponsoring the authoring of this new spec. This article gives an introduction to this new CSS standard, leading-trim, and what it could mean for web designers and developers.
2. How we got here: a history lesson
To understand how this became a problem, specifically on the web, we need to go back in the history of typography. Around 140 years ago, type was still set manually with individual lead boxes. To make text more readable, typesetters would put strips of lead to space lines out. (That’s where the word “leading” came from
标签：Trim,trim,Leading,Typesetting,spacing,leading,height,text,CSS From： https://blog.csdn.net/frgod/article/details/144437844