前言
之前学 W3Schools 时记入过一些 W3Schools 学习笔记 (1) – CSS Fonts.
由于太简单就没有另外写一篇, 现在感觉内容比较整齐了, 所以整理一篇出来.
属性
font-family
定义字体, 看这篇 CSS – Font Family
font-style
normal, italic, oblique. 绝大多数都是用 normal 的, italic 是斜体. oblique 没有用过
注: 不是所有字体都支持 italic 的哦
font-weight
字体的粗细
value = 100, 200, 300...900 (不是所有字体都有 100 到 900 哦)
100 叫 thin
300 叫 light
400 叫 regular
500 叫 medium
700 叫 bold
其它的很少冷门. 赋值最好不要用英文, 号码比较容易理解.
font-size
字体大小尺寸, 看这篇 CSS – rem, em, px
text-decoration
最常用的是 underline, 做 anchor 下划线.
text-transform
最常用的是 uppercase
text-align
调 horizontal alignment. 比如 left, start, center, right, end
vertical-align
调 vertical alignment, 比如 top, start, center, bottom, end
line-height
默认是 1.2 左右, 它 depend on 字体. 不同字体会有不同的 line-height ratio.
1.2 算法是 font-size 乘于 1.2
比如 16px * 1.2 = 19.2px 就是 span 的高度.
关于 line height 和 half-leading 可以看这篇.
letter-spacing
它用来调节每一个单字母的间距. 很少用到, 只有在一些 button 的地方可能会放 1px 让它阔一些.
white-space, word-break, overflow-wrap, word-wrap
看这篇 CSS – word-break, overflow-wrap, word-wrap, white-space
text-overflow
主要用来做 ellipsis, 看这篇 CSS – ellipsis and line-clamp
color
调字体颜色