版式是设计文本的艺术，使其易于阅读并适合其目的。
在该课程中，使用排版来构建 nutrition label 网页。将学习如何使用 CSS 设置文本样式、调整行高以及定位文本。

该篇文章为 freecodecape Learn Typography by Building a Nutrition Label 学习笔记

查看效果：nutrition-label

letter-spacing

letter-spacing: 0.15px; 属性可用于调整元素中文本的每个字符之间的间距。

rem

rem 单位调用 room em，与 html 元素的字体大小相关。

1
2
3
4
5
6
7
html {
  font-size: 16px;
}

.small-text{
  font-size: 0.85rem;
}

计算出 .small-text的字体大小大约为 13.6px。

::not pseudo-selector

::not伪类选择器可用于选择与给定 CSS 规则不匹配的所有元素。

1
2
3
.daily-value p:not(.no-divider) {
  border-bottom: 1px solid #888989;
}