前端开发中，与字体相关的属性有很多，以下是一些常用的例子，并根据类别进行分组：
1. 字体家族 (font-family): 指定元素的字体。可以指定多个字体，浏览器会按顺序尝试使用，直到找到可用的字体。
- 例子：
font-family: Arial, Helvetica, sans-serif;(首先尝试 Arial，如果不可用则尝试 Helvetica，最后尝试 sans-serif 通用字体) font-family: "Times New Roman", Times, serif;(指定 Times New Roman 字体)font-family: monospace;(使用等宽字体)
2. 字体大小 (font-size): 指定字体的大小。
- 例子：
font-size: 16px;(使用像素单位) font-size: 1em;(使用 em 单位，相对于父元素的字体大小)font-size: 100%;(使用百分比，相对于父元素的字体大小)font-size: large;(使用预定义的关键字，例如 small, medium, large, x-large 等)
3. 字体粗细 (font-weight): 指定字体的粗细。
- 例子：
font-weight: bold;(加粗) font-weight: normal;(正常)font-weight: lighter;(更细)font-weight: 400;(正常, 与 normal 相同)font-weight: 700;(加粗, 与 bold 相同)font-weight: 100;-900;(以 100 为增量，数值越大字体越粗)
4. 字体样式 (font-style): 指定字体的样式。
- 例子：
font-style: italic;(斜体) font-style: normal;(正常)font-style: oblique;(倾斜，与 italic 类似，但效果可能因浏览器而异)
5. 行高 (line-height): 指定文本行的高度。
- 例子：
line-height: 1.5;(行高为字体大小的 1.5 倍) line-height: 20px;(使用像素单位)line-height: 150%;(使用百分比，相对于字体大小)
6. 字体变体 (font-variant): 控制小型大写字母的使用。
- 例子：
font-variant: small-caps;(小型大写字母) font-variant: normal;(正常)
7. 字体拉伸 (font-stretch): 控制字体的拉伸或压缩。
- 例子：
font-stretch: condensed;(压缩) font-stretch: expanded;(拉伸)font-stretch: ultra-condensed;(极度压缩)font-stretch: ultra-expanded;(极度拉伸)font-stretch: normal;(正常) (支持程度有限)
8. font 简写属性: 可以同时设置多个字体属性。
- 例子:
font: italic bold 16px/1.5 Arial, sans-serif;(设置样式、粗细、大小、行高和字体系列)
一些其他的字体相关属性：
text-align: 文本对齐方式 (left, right, center, justify)text-decoration: 文本装饰 (underline, overline, line-through, none)text-transform: 文本转换 (uppercase, lowercase, capitalize)text-shadow: 文本阴影color: 文本颜色
这些只是一些常用的字体相关属性，还有其他一些更高级的属性可以用于更精细的控制，例如 @font-face 用于加载自定义字体。 选择合适的属性可以让你更好地控制文本的样式和外观，提升用户体验。